From c88a767d1a03a71a7a98f29065dc4fe2252f06fb Mon Sep 17 00:00:00 2001 From: Vadim <44135514+vodemn@users.noreply.github.com> Date: Sun, 29 Jan 2023 18:13:30 +0300 Subject: [PATCH] fixed camera screen layout --- lib/res/dimens.dart | 4 + .../widget_container_camera.dart | 88 +++++++++++++++---- .../widget_container_reading_value.dart | 6 ++ 3 files changed, 80 insertions(+), 18 deletions(-) diff --git a/lib/res/dimens.dart b/lib/res/dimens.dart index cd80939..0a5b2e4 100644 --- a/lib/res/dimens.dart +++ b/lib/res/dimens.dart @@ -21,6 +21,10 @@ class Dimens { static const Duration durationML = Duration(milliseconds: 250); static const Duration durationL = Duration(milliseconds: 300); + // TopBar + /// Probably this is a bad practice, but with text size locked, the height is always 212 + static const double readingContainerHeight = 212; + // `CenteredSlider` static const double cameraSliderTrackHeight = grid4; static const double cameraSliderTrackRadius = cameraSliderTrackHeight / 2; 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 a5cc282..5f54e99 100644 --- a/lib/screens/metering/components/camera_container/widget_container_camera.dart +++ b/lib/screens/metering/components/camera_container/widget_container_camera.dart @@ -38,6 +38,9 @@ class CameraContainer extends StatelessWidget { @override Widget build(BuildContext context) { + final topBarOverflow = Dimens.readingContainerHeight - + ((MediaQuery.of(context).size.width - Dimens.grid8 - 2 * Dimens.paddingM) / 2) / + PlatformConfig.cameraPreviewAspectRatio; return Column( children: [ MeteringTopBar( @@ -49,11 +52,17 @@ class CameraContainer extends StatelessWidget { onIsoChanged: onIsoChanged, onNdChanged: onNdChanged, ), + appendixHeight: topBarOverflow, + preview: const _CameraViewBuilder(), ), Expanded( child: Padding( padding: const EdgeInsets.symmetric(horizontal: Dimens.paddingM), - child: ExposurePairsList(exposurePairs), + child: _MiddleContentWrapper( + topBarOverflow: topBarOverflow, + leftContent: ExposurePairsList(exposurePairs), + rightContent: const _CameraControlsBuilder(), + ), ), ), ], @@ -85,23 +94,66 @@ class _CameraControlsBuilder extends StatelessWidget { @override Widget build(BuildContext context) { - return BlocBuilder( - builder: (context, state) => AnimatedSwitcher( - duration: Dimens.durationS, - child: state is CameraActiveState - ? CameraControls( - exposureOffsetRange: state.exposureOffsetRange, - exposureOffsetValue: state.currentExposureOffset, - onExposureOffsetChanged: (value) { - context.read().add(ExposureOffsetChangedEvent(value)); - }, - zoomRange: state.zoomRange, - zoomValue: state.currentZoom, - onZoomChanged: (value) { - context.read().add(ZoomChangedEvent(value)); - }, - ) - : const SizedBox.shrink(), + return Padding( + padding: const EdgeInsets.symmetric(vertical: Dimens.paddingM), + child: BlocBuilder( + builder: (context, state) => AnimatedSwitcher( + duration: Dimens.durationS, + child: state is CameraActiveState + ? CameraControls( + exposureOffsetRange: state.exposureOffsetRange, + exposureOffsetValue: state.currentExposureOffset, + onExposureOffsetChanged: (value) { + context.read().add(ExposureOffsetChangedEvent(value)); + }, + zoomRange: state.zoomRange, + zoomValue: state.currentZoom, + onZoomChanged: (value) { + context.read().add(ZoomChangedEvent(value)); + }, + ) + : const SizedBox.shrink(), + ), + ), + ); + } +} + +class _MiddleContentWrapper extends StatelessWidget { + final double topBarOverflow; + final Widget leftContent; + final Widget rightContent; + + const _MiddleContentWrapper({ + required this.topBarOverflow, + required this.leftContent, + required this.rightContent, + }); + + @override + Widget build(BuildContext context) { + return LayoutBuilder( + builder: (context, constraints) => OverflowBox( + alignment: Alignment.bottomCenter, + maxHeight: constraints.maxHeight + topBarOverflow.abs(), + maxWidth: constraints.maxWidth, + child: Row( + children: [ + Expanded( + child: Padding( + padding: EdgeInsets.only(top: topBarOverflow >= 0 ? topBarOverflow : 0), + child: leftContent, + ), + ), + const SizedBox(width: Dimens.grid8), + Expanded( + child: Padding( + padding: EdgeInsets.only(top: topBarOverflow <= 0 ? -topBarOverflow : 0), + child: rightContent, + ), + ), + ], + ), ), ); } 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 66ed30f..d1c55c7 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 @@ -68,11 +68,17 @@ class _ReadingValueBuilder extends StatelessWidget { Text( reading.label, style: textTheme.labelMedium?.copyWith(color: textColor), + maxLines: 1, + overflow: TextOverflow.visible, + softWrap: false, ), const SizedBox(height: Dimens.grid4), Text( reading.value, style: textTheme.titleMedium?.copyWith(color: textColor), + maxLines: 1, + overflow: TextOverflow.visible, + softWrap: false, ), ], );