KazukyAkayashi/m3_lightmeter
KazukyAkayashi/m3_lightmeter
1
0
Fork 0
mirror of https://github.com/vodemn/m3_lightmeter.git synced 2024-11-22 07:20:39 +00:00
Code Issues Projects Releases Packages Wiki Activity

Open AnimatedDialog with Navigator

Browse source
This commit is contained in:
Vadim 2022-12-11 19:19:38 +03:00
parent 9abad012e3
commit 7018f06270
3 changed files with 34 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
lib/screens/metering/components/bottom_controls/bottom_controls.dart
View file

@ -28,7 +28,7 @@ class MeteringBottomControls extends StatelessWidget {
child: SafeArea( child: SafeArea(
top: false, top: false,
child: Padding( child: Padding(
padding: const EdgeInsets.symmetric(vertical: Dimens.paddingM), padding: const EdgeInsets.symmetric(vertical: Dimens.paddingL),
child: Row( child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly, mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [ children: [

4
lib/screens/metering/components/topbar/components/reading_container.dart
View file

@ -51,10 +51,10 @@ class _ReadingValueBuilder extends StatelessWidget {
reading.label, reading.label,
style: textTheme.labelMedium?.copyWith(color: Theme.of(context).colorScheme.onPrimaryContainer), style: textTheme.labelMedium?.copyWith(color: Theme.of(context).colorScheme.onPrimaryContainer),
), ),
const SizedBox(height: Dimens.grid8), const SizedBox(height: Dimens.grid4),
Text( Text(
reading.value, reading.value,
style: textTheme.bodyLarge?.copyWith(color: Theme.of(context).colorScheme.onPrimaryContainer), style: textTheme.titleMedium?.copyWith(color: Theme.of(context).colorScheme.onPrimaryContainer),
), ),
], ],
); );

56
lib/screens/metering/components/topbar/components/shared/animated_dialog.dart
View file

@ -22,7 +22,6 @@ class AnimatedDialog extends StatefulWidget {
class AnimatedDialogState extends State<AnimatedDialog> with SingleTickerProviderStateMixin { class AnimatedDialogState extends State<AnimatedDialog> with SingleTickerProviderStateMixin {
final GlobalKey _key = GlobalKey(); final GlobalKey _key = GlobalKey();
final LayerLink _layerLink = LayerLink();
late final Size _closedSize; late final Size _closedSize;
late final Offset _closedOffset; late final Offset _closedOffset;
@ -36,7 +35,8 @@ class AnimatedDialogState extends State<AnimatedDialog> with SingleTickerProvide
late final Animation<double> _borderRadiusAnimation; late final Animation<double> _borderRadiusAnimation;
late final Animation<double> _closedOpacityAnimation; late final Animation<double> _closedOpacityAnimation;
late final Animation<double> _openedOpacityAnimation; late final Animation<double> _openedOpacityAnimation;
OverlayEntry? _overlayEntry;
bool _isDialogShown = false;
@override @override
void initState() { void initState() {
@ -88,8 +88,8 @@ class AnimatedDialogState extends State<AnimatedDialog> with SingleTickerProvide
begin: _closedSize, begin: _closedSize,
end: widget.openedSize ?? end: widget.openedSize ??
Size( Size(
mediaQuery.size.width - mediaQuery.padding.horizontal - Dimens.paddingM * 4, mediaQuery.size.width - mediaQuery.padding.horizontal - Dimens.paddingM * 2,
mediaQuery.size.height - mediaQuery.padding.vertical - Dimens.paddingM * 4, mediaQuery.size.height - mediaQuery.padding.vertical - Dimens.paddingM * 2,
), ),
); );
_sizeAnimation = _sizeTween.animate(_defaultCurvedAnimation); _sizeAnimation = _sizeTween.animate(_defaultCurvedAnimation);
@ -120,16 +120,13 @@ class AnimatedDialogState extends State<AnimatedDialog> with SingleTickerProvide
return InkWell( return InkWell(
key: _key, key: _key,
onTap: _openDialog, onTap: _openDialog,
child: CompositedTransformTarget( child: Opacity(
link: _layerLink, opacity: _isDialogShown ? 0 : 1,
child: Opacity( child: ClipRRect(
opacity: _overlayEntry != null ? 0 : 1, borderRadius: BorderRadius.circular(Dimens.borderRadiusM),
child: ClipRRect( child: ColoredBox(
borderRadius: BorderRadius.circular(Dimens.borderRadiusM), color: Theme.of(context).colorScheme.primaryContainer,
child: ColoredBox( child: widget.child ?? widget.closedChild,
color: Theme.of(context).colorScheme.primaryContainer,
child: widget.child ?? widget.closedChild,
),
), ),
), ),
), ),
@ -137,12 +134,14 @@ class AnimatedDialogState extends State<AnimatedDialog> with SingleTickerProvide
} }
void _openDialog() { void _openDialog() {
setState(() { Navigator.of(context).push(
_overlayEntry = OverlayEntry( PageRouteBuilder(
builder: (context) => CompositedTransformFollower( barrierColor: Colors.transparent,
offset: Offset(-_closedOffset.dx, -_closedOffset.dy), opaque: false,
link: _layerLink, transitionDuration: Duration.zero,
showWhenUnlinked: false, reverseTransitionDuration: Duration.zero,
pageBuilder: (_, __, ___) => WillPopScope(
onWillPop: () => _animateReverse().then((value) => true),
child: _AnimatedOverlay( child: _AnimatedOverlay(
controller: _animationController, controller: _animationController,
barrierColorAnimation: _barrierColorAnimation, barrierColorAnimation: _barrierColorAnimation,
@ -164,20 +163,27 @@ class AnimatedDialogState extends State<AnimatedDialog> with SingleTickerProvide
child: widget.child, child: widget.child,
), ),
), ),
); ),
);
_animateForward();
}
void _animateForward() {
setState(() {
_isDialogShown = true;
}); });
Overlay.of(context)?.insert(_overlayEntry!);
_animationController.forward(); _animationController.forward();
} }
Future<void> close() async { Future<void> _animateReverse() async {
_animationController.reverse(); _animationController.reverse();
await Future.delayed(_animationController.reverseDuration! * timeDilation); await Future.delayed(_animationController.reverseDuration! * timeDilation);
_overlayEntry?.remove();
setState(() { setState(() {
_overlayEntry = null; _isDialogShown = false;
}); });
} }
Future<void> close() => _animateReverse().then((_) => Navigator.of(context).pop());
} }
class _AnimatedOverlay extends StatelessWidget { class _AnimatedOverlay extends StatelessWidget {