added color animation for AnimatedDialog

This commit is contained in:
Vadim 2023-01-30 12:08:04 +03:00
parent ca5b30a026
commit 48d8439216
5 changed files with 87 additions and 60 deletions

View file

@ -175,7 +175,11 @@ class _ThemeDataProvider extends StatelessWidget {
primaryColor: primaryColor,
colorScheme: scheme,
dialogBackgroundColor: scheme.surface,
dialogTheme: DialogTheme(backgroundColor: scheme.surface),
dialogTheme: DialogTheme(
backgroundColor: scheme.surface,
surfaceTintColor: scheme.surfaceTint,
elevation: 6,
),
scaffoldBackgroundColor: scheme.surface,
);
}

View file

@ -35,6 +35,8 @@ class AnimatedDialogState extends State<AnimatedDialog> with SingleTickerProvide
late final Animation<double> _borderRadiusAnimation;
late final Animation<double> _closedOpacityAnimation;
late final Animation<double> _openedOpacityAnimation;
late final Animation<Color?> _foregroundColorAnimation;
late final Animation<double> _elevationAnimation;
bool _isDialogShown = false;
@ -112,6 +114,20 @@ class AnimatedDialogState extends State<AnimatedDialog> with SingleTickerProvide
});
}
@override
void didChangeDependencies() {
super.didChangeDependencies();
_foregroundColorAnimation = ColorTween(
begin: Theme.of(context).colorScheme.primaryContainer,
end: Theme.of(context).colorScheme.surface,
).animate(_defaultCurvedAnimation);
_elevationAnimation = Tween<double>(
begin: 0,
end: Theme.of(context).dialogTheme.elevation!,
).animate(_defaultCurvedAnimation);
}
@override
void dispose() {
_animationController.dispose();
@ -151,6 +167,8 @@ class AnimatedDialogState extends State<AnimatedDialog> with SingleTickerProvide
sizeAnimation: _sizeAnimation,
offsetAnimation: _offsetAnimation,
borderRadiusAnimation: _borderRadiusAnimation,
foregroundColorAnimation: _foregroundColorAnimation,
elevationAnimation: _elevationAnimation,
onDismiss: close,
builder: widget.closedChild != null && widget.openedChild != null
? (_) => _AnimatedSwitcher(
@ -195,6 +213,8 @@ class _AnimatedOverlay extends StatelessWidget {
final Animation<Size?> sizeAnimation;
final Animation<Size?> offsetAnimation;
final Animation<double> borderRadiusAnimation;
final Animation<Color?> foregroundColorAnimation;
final Animation<double> elevationAnimation;
final VoidCallback onDismiss;
final Widget? child;
final Widget Function(BuildContext context)? builder;
@ -205,6 +225,8 @@ class _AnimatedOverlay extends StatelessWidget {
required this.sizeAnimation,
required this.offsetAnimation,
required this.borderRadiusAnimation,
required this.foregroundColorAnimation,
required this.elevationAnimation,
required this.onDismiss,
this.child,
this.builder,
@ -236,7 +258,9 @@ class _AnimatedOverlay extends StatelessWidget {
child: ClipRRect(
borderRadius: BorderRadius.circular(borderRadiusAnimation.value),
child: Material(
color: Theme.of(context).colorScheme.primaryContainer,
elevation: elevationAnimation.value,
surfaceTintColor: Theme.of(context).colorScheme.surfaceTint,
color: foregroundColorAnimation.value,
child: builder?.call(context) ?? child,
),
),

View file

@ -57,9 +57,7 @@ class _PhotographyValuePickerDialogState<T extends PhotographyValue>
return Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
ColoredBox(
color: Theme.of(context).colorScheme.primaryContainer,
child: Column(
Column(
children: [
Padding(
padding: const EdgeInsets.fromLTRB(
@ -83,12 +81,11 @@ class _PhotographyValuePickerDialogState<T extends PhotographyValue>
),
),
Divider(
color: Theme.of(context).colorScheme.onPrimaryContainer,
color: Theme.of(context).colorScheme.onSurface,
height: 0,
),
],
),
),
Expanded(
child: ListView.builder(
controller: _scrollController,
@ -117,12 +114,10 @@ class _PhotographyValuePickerDialogState<T extends PhotographyValue>
),
),
),
ColoredBox(
color: Theme.of(context).colorScheme.primaryContainer,
child: Column(
Column(
children: [
Divider(
color: Theme.of(context).colorScheme.onPrimaryContainer,
color: Theme.of(context).colorScheme.onSurface,
height: 0,
),
Padding(
@ -146,7 +141,6 @@ class _PhotographyValuePickerDialogState<T extends PhotographyValue>
),
],
),
),
],
);
}

View file

@ -12,10 +12,12 @@ class ReadingValue {
}
class ReadingValueContainer extends StatelessWidget {
final Color? backgroundColor;
late final List<Widget> _items;
ReadingValueContainer({
required List<ReadingValue> values,
this.backgroundColor,
super.key,
}) {
_items = [];
@ -29,6 +31,7 @@ class ReadingValueContainer extends StatelessWidget {
ReadingValueContainer.singleValue({
required ReadingValue value,
this.backgroundColor,
super.key,
}) : _items = [_ReadingValueBuilder(value)];
@ -37,7 +40,7 @@ class ReadingValueContainer extends StatelessWidget {
return ClipRRect(
borderRadius: BorderRadius.circular(Dimens.borderRadiusM),
child: ColoredBox(
color: Theme.of(context).colorScheme.primaryContainer,
color: backgroundColor ?? Theme.of(context).colorScheme.primaryContainer,
child: Padding(
padding: const EdgeInsets.all(Dimens.paddingM),
child: Column(

View file

@ -89,6 +89,7 @@ class _IsoValueTile extends StatelessWidget {
evDifferenceBuilder: (selected, other) => selected.toStringDifference(other),
onChanged: onChanged,
closedChild: ReadingValueContainer.singleValue(
backgroundColor: null,
value: ReadingValue(
label: S.of(context).iso,
value: value.value.toString(),
@ -118,6 +119,7 @@ class _NdValueTile extends StatelessWidget {
evDifferenceBuilder: (selected, other) => other.toStringDifference(selected),
onChanged: onChanged,
closedChild: ReadingValueContainer.singleValue(
backgroundColor: null,
value: ReadingValue(
label: S.of(context).iso,
value: value.value.toString(),