chore: Delay until screen darkening (#5009)

This commit is contained in:
ggurdin 2025-12-31 11:18:31 -05:00 committed by GitHub
parent 857d369f41
commit fb2ef4b0a1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 56 additions and 29 deletions

View file

@ -51,6 +51,7 @@ import 'package:fluffychat/pangea/common/controllers/pangea_controller.dart';
import 'package:fluffychat/pangea/common/utils/error_handler.dart';
import 'package:fluffychat/pangea/common/utils/firebase_analytics.dart';
import 'package:fluffychat/pangea/common/utils/overlay.dart';
import 'package:fluffychat/pangea/common/widgets/transparent_backdrop.dart';
import 'package:fluffychat/pangea/constructs/construct_identifier.dart';
import 'package:fluffychat/pangea/events/constants/pangea_event_types.dart';
import 'package:fluffychat/pangea/events/event_wrappers/pangea_message_event.dart';
@ -2058,6 +2059,19 @@ class ChatController extends State<ChatPageWithRoom>
if (buttonEventID == event.eventId) {
depressMessageButton.value = true;
OverlayUtil.showOverlay(
context: context,
child: TransparentBackdrop(
backgroundColor: Colors.black,
onDismiss: clearSelectedEvents,
blurBackground: true,
animateBackground: true,
backgroundAnimationDuration: const Duration(milliseconds: 200),
),
position: OverlayPositionEnum.centered,
overlayKey: "button_message_backdrop",
);
Future.delayed(const Duration(milliseconds: 200), () {
if (_router.state.path != ':roomid') {
// The user has navigated away from the chat,

View file

@ -9,45 +9,58 @@ class TransparentBackdrop extends StatelessWidget {
final VoidCallback? onDismiss;
final bool blurBackground;
/// New
final bool animateBackground;
final Duration backgroundAnimationDuration;
const TransparentBackdrop({
super.key,
this.onDismiss,
this.backgroundColor,
this.blurBackground = false,
this.animateBackground = false,
this.backgroundAnimationDuration = const Duration(milliseconds: 200),
});
@override
Widget build(BuildContext context) {
return Material(
borderOnForeground: false,
color:
backgroundColor?.withAlpha((0.8 * 255).round()) ?? Colors.transparent,
clipBehavior: Clip.antiAlias,
child: InkWell(
hoverColor: Colors.transparent,
splashColor: Colors.transparent,
focusColor: Colors.transparent,
highlightColor: Colors.transparent,
onTap: () {
if (onDismiss != null) {
onDismiss!();
}
MatrixState.pAnyState.closeOverlay();
},
child: BackdropFilter(
filter: blurBackground
? ImageFilter.blur(
sigmaX: 3.0,
sigmaY: 3.0,
)
: ImageFilter.blur(sigmaX: 0, sigmaY: 0),
child: Container(
height: double.infinity,
width: double.infinity,
color: Colors.transparent,
),
),
final Color targetColor =
backgroundColor?.withAlpha((0.8 * 255).round()) ?? Colors.transparent;
return TweenAnimationBuilder<double>(
tween: Tween<double>(
begin: animateBackground ? 0.0 : 1.0,
end: 1.0,
),
duration: animateBackground ? backgroundAnimationDuration : Duration.zero,
builder: (context, t, child) {
return Material(
borderOnForeground: false,
color: Color.lerp(
Colors.transparent,
targetColor,
t,
),
clipBehavior: Clip.antiAlias,
child: InkWell(
hoverColor: Colors.transparent,
splashColor: Colors.transparent,
focusColor: Colors.transparent,
highlightColor: Colors.transparent,
onTap: () {
onDismiss?.call();
MatrixState.pAnyState.closeOverlay();
},
child: BackdropFilter(
filter: ImageFilter.blur(
sigmaX: blurBackground ? 3.0 * t : 0,
sigmaY: blurBackground ? 3.0 * t : 0,
),
child: const SizedBox.expand(),
),
),
);
},
);
}
}