From 8a71c8db13dbbd6b380b36091ec8d27bd15bd0d9 Mon Sep 17 00:00:00 2001 From: Vadim Date: Fri, 4 Aug 2023 16:17:40 +0200 Subject: [PATCH] Added switch animations to `MeteringScreen` --- lib/res/dimens.dart | 1 + .../widget_placeholder_camera_view.dart | 5 +- .../widget_container_camera.dart | 26 ++-- .../widget_list_exposure_pairs.dart | 112 +++++++++--------- .../widget_container_reading_value.dart | 15 ++- 5 files changed, 82 insertions(+), 77 deletions(-) diff --git a/lib/res/dimens.dart b/lib/res/dimens.dart index 1eefdc1..a1bb780 100644 --- a/lib/res/dimens.dart +++ b/lib/res/dimens.dart @@ -25,6 +25,7 @@ class Dimens { static const Duration durationM = Duration(milliseconds: 200); static const Duration durationML = Duration(milliseconds: 250); static const Duration durationL = Duration(milliseconds: 300); + static const Duration switchDuration = Duration(milliseconds: 100); static const double enabledOpacity = 1.0; static const double disabledOpacity = 0.38; diff --git a/lib/screens/metering/components/camera_container/components/camera_view_placeholder/widget_placeholder_camera_view.dart b/lib/screens/metering/components/camera_container/components/camera_view_placeholder/widget_placeholder_camera_view.dart index 058da74..a2914d2 100644 --- a/lib/screens/metering/components/camera_container/components/camera_view_placeholder/widget_placeholder_camera_view.dart +++ b/lib/screens/metering/components/camera_container/components/camera_view_placeholder/widget_placeholder_camera_view.dart @@ -10,10 +10,9 @@ class CameraViewPlaceholder extends StatelessWidget { @override Widget build(BuildContext context) { return Card( + color: error != null ? null : Colors.black, shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(Dimens.borderRadiusM)), - child: Center( - child: error != null ? const Icon(Icons.no_photography) : const CircularProgressIndicator(), - ), + child: Center(child: error != null ? const Icon(Icons.no_photography) : null), ); } } diff --git a/lib/screens/metering/components/camera_container/widget_container_camera.dart b/lib/screens/metering/components/camera_container/widget_container_camera.dart index 2f8ef45..7ac43eb 100644 --- a/lib/screens/metering/components/camera_container/widget_container_camera.dart +++ b/lib/screens/metering/components/camera_container/widget_container_camera.dart @@ -110,17 +110,17 @@ class _CameraViewBuilder extends StatelessWidget { return AspectRatio( aspectRatio: PlatformConfig.cameraPreviewAspectRatio, child: BlocBuilder( - buildWhen: (previous, current) => - current is CameraLoadingState || - current is CameraInitializedState || - current is CameraErrorState, - builder: (context, state) { - if (state is CameraInitializedState) { - return Center(child: CameraView(controller: state.controller)); - } else { - return CameraViewPlaceholder(error: state is CameraErrorState ? state.error : null); - } - }, + buildWhen: (previous, current) => current is! CameraActiveState, + builder: (context, state) => Center( + child: AnimatedSwitcher( + duration: Dimens.durationM, + child: switch (state) { + CameraInitializedState() => CameraView(controller: state.controller), + CameraErrorState() => CameraViewPlaceholder(error: state.error), + _ => const CameraViewPlaceholder(error: null), + }, + ), + ), ), ); } @@ -161,11 +161,11 @@ class _CameraControlsBuilder extends StatelessWidget { }, ); } else { - child = const SizedBox.shrink(); + child = const Column(children: [Expanded(child: SizedBox.shrink())],); } return AnimatedSwitcher( - duration: Dimens.durationS, + duration: Dimens.switchDuration, child: child, ); }, diff --git a/lib/screens/metering/components/shared/exposure_pairs_list/widget_list_exposure_pairs.dart b/lib/screens/metering/components/shared/exposure_pairs_list/widget_list_exposure_pairs.dart index f2496b2..71b293e 100644 --- a/lib/screens/metering/components/shared/exposure_pairs_list/widget_list_exposure_pairs.dart +++ b/lib/screens/metering/components/shared/exposure_pairs_list/widget_list_exposure_pairs.dart @@ -12,70 +12,72 @@ class ExposurePairsList extends StatelessWidget { @override Widget build(BuildContext context) { - if (exposurePairs.isEmpty) { - return const EmptyExposurePairsList(); - } - return Stack( - alignment: Alignment.center, - children: [ - Positioned.fill( - child: ListView.builder( - key: ValueKey(exposurePairs.hashCode), - padding: const EdgeInsets.symmetric(vertical: Dimens.paddingL), - itemCount: exposurePairs.length, - itemBuilder: (_, index) => Stack( + return AnimatedSwitcher( + duration: Dimens.switchDuration, + child: exposurePairs.isEmpty + ? const EmptyExposurePairsList() + : Stack( alignment: Alignment.center, children: [ - Row( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Expanded( - child: Align( - alignment: Alignment.centerLeft, - child: ExposurePairsListItem( - exposurePairs[index].aperture, - tickOnTheLeft: false, + Positioned.fill( + child: ListView.builder( + key: ValueKey(exposurePairs.hashCode), + padding: const EdgeInsets.symmetric(vertical: Dimens.paddingL), + itemCount: exposurePairs.length, + itemBuilder: (_, index) => Stack( + alignment: Alignment.center, + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.center, + children: [ + Expanded( + child: Align( + alignment: Alignment.centerLeft, + child: ExposurePairsListItem( + exposurePairs[index].aperture, + tickOnTheLeft: false, + ), + ), + ), + Expanded( + child: Align( + alignment: Alignment.centerLeft, + child: ExposurePairsListItem( + exposurePairs[index].shutterSpeed, + tickOnTheLeft: true, + ), + ), + ), + ], ), - ), - ), - Expanded( - child: Align( - alignment: Alignment.centerLeft, - child: ExposurePairsListItem( - exposurePairs[index].shutterSpeed, - tickOnTheLeft: true, + Positioned( + top: 0, + bottom: 0, + child: LayoutBuilder( + builder: (context, constraints) => Align( + alignment: index == 0 + ? Alignment.bottomCenter + : (index == exposurePairs.length - 1 + ? Alignment.topCenter + : Alignment.center), + child: SizedBox( + height: index == 0 || index == exposurePairs.length - 1 + ? constraints.maxHeight / 2 + : constraints.maxHeight, + child: ColoredBox( + color: Theme.of(context).colorScheme.onBackground, + child: const SizedBox(width: 1), + ), + ), + ), + ), ), - ), - ), - ], - ), - Positioned( - top: 0, - bottom: 0, - child: LayoutBuilder( - builder: (context, constraints) => Align( - alignment: index == 0 - ? Alignment.bottomCenter - : (index == exposurePairs.length - 1 - ? Alignment.topCenter - : Alignment.center), - child: SizedBox( - height: index == 0 || index == exposurePairs.length - 1 - ? constraints.maxHeight / 2 - : constraints.maxHeight, - child: ColoredBox( - color: Theme.of(context).colorScheme.onBackground, - child: const SizedBox(width: 1), - ), - ), + ], ), ), ), ], ), - ), - ), - ], ); } } diff --git a/lib/screens/metering/components/shared/readings_container/components/reading_value_container/widget_container_reading_value.dart b/lib/screens/metering/components/shared/readings_container/components/reading_value_container/widget_container_reading_value.dart index b40f666..3254456 100644 --- a/lib/screens/metering/components/shared/readings_container/components/reading_value_container/widget_container_reading_value.dart +++ b/lib/screens/metering/components/shared/readings_container/components/reading_value_container/widget_container_reading_value.dart @@ -72,12 +72,15 @@ class _ReadingValueBuilder extends StatelessWidget { softWrap: false, ), const SizedBox(height: Dimens.grid4), - Text( - reading.value, - style: textTheme.titleMedium?.copyWith(color: textColor), - maxLines: 1, - overflow: TextOverflow.ellipsis, - softWrap: false, + AnimatedSwitcher( + duration: Dimens.switchDuration, + child: Text( + reading.value, + style: textTheme.titleMedium?.copyWith(color: textColor), + maxLines: 1, + overflow: TextOverflow.ellipsis, + softWrap: false, + ), ) ], );