From a7c4ba35842dc0d37f2fbb4a27ced861d16cb8b1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Szymon=20Kowali=C5=84ski?= Date: Sat, 3 Aug 2024 15:01:32 +0200 Subject: [PATCH 1/3] fix(home): eliminate jumping scroll --- .../home_view/widgets/news_section.dart | 10 ++++++++-- .../big_preview_card_loading.dart | 19 ++++++++++++++----- 2 files changed, 22 insertions(+), 7 deletions(-) diff --git a/lib/features/home_view/widgets/news_section.dart b/lib/features/home_view/widgets/news_section.dart index aabb35bb..4a71a459 100644 --- a/lib/features/home_view/widgets/news_section.dart +++ b/lib/features/home_view/widgets/news_section.dart @@ -34,13 +34,19 @@ class _NewsList extends ConsumerWidget { @override Widget build(BuildContext context, WidgetRef ref) { final state = ref.watch(newsRepositoryProvider); + return switch (state) { AsyncLoading() => const Padding( padding: EdgeInsets.only( left: HomeViewConfig.paddingMedium, - top: HomeViewConfig.paddingMedium, + top: HomeViewConfig.paddingMedium * + 2, // twice the padding of normal state, just to look cool + ), + child: SizedBox( + height: + BigPreviewCardConfig.cardHeight - HomeViewConfig.paddingMedium, + child: BigScrollableSectionLoading(), ), - child: BigScrollableSectionLoading(), ), AsyncError(:final error) => MyErrorWidget(error), AsyncValue(:final value) => Column( diff --git a/lib/widgets/loading_widgets/specific_imitations/big_preview_card_loading.dart b/lib/widgets/loading_widgets/specific_imitations/big_preview_card_loading.dart index ef5c00b4..5cb882e0 100644 --- a/lib/widgets/loading_widgets/specific_imitations/big_preview_card_loading.dart +++ b/lib/widgets/loading_widgets/specific_imitations/big_preview_card_loading.dart @@ -16,7 +16,7 @@ class BigPreviewCardLoading extends StatelessWidget { ShimmerLoadingItem( child: Container( width: BigPreviewCardConfig.cardWidth, - height: 135, + height: 155, decoration: BoxDecoration( color: Colors.white, borderRadius: BorderRadius.circular(8), @@ -35,13 +35,22 @@ class _LoadingText extends StatelessWidget { @override Widget build(BuildContext context) { + const gap = 22.5; return Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - const SizedBox(height: 16), - PreviewTextPrototype(width: BigPreviewCardConfig.cardWidth), - const SizedBox(height: 16), - PreviewTextPrototype(width: BigPreviewCardConfig.cardWidth / 1.5), + const SizedBox(height: gap), + PreviewTextPrototype(width: BigPreviewCardConfig.cardWidth, height: 25), + const SizedBox(height: gap), + PreviewTextPrototype( + width: BigPreviewCardConfig.cardWidth / 1.3, + height: 25, + ), + const SizedBox(height: gap), + PreviewTextPrototype( + width: BigPreviewCardConfig.cardWidth / 2.5, + height: 25, + ), ], ); } From 38893dde6cfa8371013e9d40730ff6e44dcc8684 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Szymon=20Kowali=C5=84ski?= Date: Sat, 3 Aug 2024 17:10:37 +0200 Subject: [PATCH 2/3] fix(map): normalize markers size --- lib/config/map_view_config.dart | 6 +- .../map_view/utils/map_marker_utils.dart | 60 ++++++++----------- 2 files changed, 30 insertions(+), 36 deletions(-) diff --git a/lib/config/map_view_config.dart b/lib/config/map_view_config.dart index ab6d24b7..59a8976b 100644 --- a/lib/config/map_view_config.dart +++ b/lib/config/map_view_config.dart @@ -36,8 +36,10 @@ abstract class MapWidgetConfig { ); static const mapType = MapType.normal; - static const mapMarkerOriginWidth = 28; - static const activeMapMarkerOriginWidth = 40; + static const mapMarkerWidth = 22.0; + static const mapMarkerHeight = 34.0; + static const activeMapMarkerWidth = 30.4; + static const activeMapMarkerHeight = 46.4; } abstract class BuildingSearchConfig { diff --git a/lib/features/map_view/utils/map_marker_utils.dart b/lib/features/map_view/utils/map_marker_utils.dart index 1c546f86..e15e1914 100644 --- a/lib/features/map_view/utils/map_marker_utils.dart +++ b/lib/features/map_view/utils/map_marker_utils.dart @@ -1,7 +1,4 @@ -import "dart:ui" as ui; - import "package:flutter/foundation.dart"; -import "package:flutter/services.dart"; import "package:flutter/widgets.dart"; import "package:google_maps_flutter/google_maps_flutter.dart"; @@ -15,47 +12,42 @@ class MapMarkerUtils { static late final BitmapDescriptor activeParkingMapMarker; static Future loadMapMarkerAssets(BuildContext context) async { - final pixelRatio = - kIsWeb ? 1 : MediaQuery.devicePixelRatioOf(context).toInt(); - - buildingMapMarker = await _AssetScaledLoader.loadScaledBitmapDescriptor( + final configuration = context.mapMarkerConfiguration; + final activeMarkerConfig = context.activeMapMarkerConfiguration; + buildingMapMarker = await BitmapDescriptor.asset( + configuration, Assets.mapMarkers.mapMarker.path, - width: MapWidgetConfig.mapMarkerOriginWidth * pixelRatio, ); - - activeBuildingMapMarker = - await _AssetScaledLoader.loadScaledBitmapDescriptor( + activeBuildingMapMarker = await BitmapDescriptor.asset( + activeMarkerConfig, Assets.mapMarkers.activeMapMarker.path, - width: MapWidgetConfig.activeMapMarkerOriginWidth * pixelRatio, ); - parkingMapMarker = await _AssetScaledLoader.loadScaledBitmapDescriptor( + parkingMapMarker = await BitmapDescriptor.asset( + configuration, Assets.mapMarkers.parkingMapMarker.path, - width: MapWidgetConfig.mapMarkerOriginWidth * pixelRatio, ); - activeParkingMapMarker = - await _AssetScaledLoader.loadScaledBitmapDescriptor( + activeParkingMapMarker = await BitmapDescriptor.asset( + activeMarkerConfig, Assets.mapMarkers.activeParkingMapMarker.path, - width: MapWidgetConfig.activeMapMarkerOriginWidth * pixelRatio, ); } } -class _AssetScaledLoader { - static Future loadScaledBitmapDescriptor( - String assetName, { - required int width, - }) async { - try { - final data = await rootBundle.load(assetName); - final codec = await ui.instantiateImageCodec( - data.buffer.asUint8List(), - targetWidth: width, +extension _ImageConfigurationX on BuildContext { + double get pixelRatio => kIsWeb ? 1.0 : MediaQuery.devicePixelRatioOf(this); + + ImageConfiguration get mapMarkerConfiguration => ImageConfiguration( + devicePixelRatio: pixelRatio, + size: const Size( + MapWidgetConfig.mapMarkerWidth, + MapWidgetConfig.mapMarkerHeight, + ), + ); + ImageConfiguration get activeMapMarkerConfiguration => ImageConfiguration( + devicePixelRatio: pixelRatio, + size: const Size( + MapWidgetConfig.activeMapMarkerWidth, + MapWidgetConfig.activeMapMarkerHeight, + ), ); - final fi = await codec.getNextFrame(); - final decode = await fi.image.toByteData(format: ui.ImageByteFormat.png); - return BitmapDescriptor.bytes(decode!.buffer.asUint8List()); - } on Exception { - return BitmapDescriptor.defaultMarker; // fallback - } - } } From 0ea82e196c03f7f0438bbff644ba63bacf98d3ce Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Szymon=20Kowali=C5=84ski?= Date: Sat, 3 Aug 2024 19:30:33 +0200 Subject: [PATCH 3/3] fix(navigation): reverse detail transition builders to default ones --- lib/config/transitions.dart | 3 --- lib/features/navigator/app_router.dart | 22 +++------------------- 2 files changed, 3 insertions(+), 22 deletions(-) diff --git a/lib/config/transitions.dart b/lib/config/transitions.dart index 000e4b8e..ff957ba4 100644 --- a/lib/config/transitions.dart +++ b/lib/config/transitions.dart @@ -3,9 +3,6 @@ import "package:auto_route/auto_route.dart"; // TODO(simon-the-shark): adjust this settings if desired abstract class TransitionsConfig { static const durationInMiliseconds = 200; - static const detailDurationInMiliseconds = 200; static const slideLeftBuilder = TransitionsBuilders.slideLeftWithFade; static const slideRightBuilder = TransitionsBuilders.slideRightWithFade; - static const fallbackBuilder = TransitionsBuilders.fadeIn; - static const detailViewBuilder = TransitionsBuilders.slideBottom; } diff --git a/lib/features/navigator/app_router.dart b/lib/features/navigator/app_router.dart index 182e49a9..cc04a24f 100644 --- a/lib/features/navigator/app_router.dart +++ b/lib/features/navigator/app_router.dart @@ -1,5 +1,4 @@ import "package:auto_route/auto_route.dart"; -import "package:flutter/foundation.dart"; import "package:flutter/material.dart"; import "package:flutter_riverpod/flutter_riverpod.dart"; import "package:riverpod_annotation/riverpod_annotation.dart"; @@ -67,14 +66,9 @@ class AppRouter extends _$AppRouter { transitionsBuilder: ref.tabBarTransitionBuilder(DepartmentsRoute.name), ), - CustomRoute( + AutoRoute( path: "departments/:id", page: DepartmentDetailRoute.page, - durationInMilliseconds: - TransitionsConfig.detailDurationInMiliseconds, - reverseDurationInMilliseconds: - TransitionsConfig.detailDurationInMiliseconds, - transitionsBuilder: TransitionsConfig.detailViewBuilder, ), CustomRoute( path: "sci-clubs", @@ -85,14 +79,9 @@ class AppRouter extends _$AppRouter { transitionsBuilder: ref.tabBarTransitionBuilder(ScienceClubsRoute.name), ), - CustomRoute( + AutoRoute( path: "sci-clubs/:id", page: ScienceClubDetailRoute.page, - durationInMilliseconds: - TransitionsConfig.detailDurationInMiliseconds, - reverseDurationInMilliseconds: - TransitionsConfig.detailDurationInMiliseconds, - transitionsBuilder: TransitionsConfig.detailViewBuilder, ), CustomRoute( path: "guide", @@ -102,14 +91,9 @@ class AppRouter extends _$AppRouter { TransitionsConfig.durationInMiliseconds, transitionsBuilder: ref.tabBarTransitionBuilder(GuideRoute.name), ), - CustomRoute( + AutoRoute( path: "aboutUs", page: AboutUsRoute.page, - durationInMilliseconds: - TransitionsConfig.detailDurationInMiliseconds, - reverseDurationInMilliseconds: - TransitionsConfig.detailDurationInMiliseconds, - transitionsBuilder: TransitionsConfig.detailViewBuilder, ), ], ),