Skip to content

Commit

Permalink
fix: modalとEEWのサイズ調整を修正
Browse files Browse the repository at this point in the history
  • Loading branch information
YumNumm committed Jul 19, 2023
1 parent 8cc97fc commit 9466109
Show file tree
Hide file tree
Showing 4 changed files with 130 additions and 80 deletions.
27 changes: 21 additions & 6 deletions lib/core/component/map/view_model/map_viewmodel.dart
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ class MapViewModel extends _$MapViewModel {
late AnimationController _scaleController;
late AnimationController _globalPointAndZoomLevelController;

final double _interactionEndFrictionCoefficient = 0.0000135;
static const double _interactionEndFrictionCoefficient = 0.0000135;

_GestureType? _gestureType;

Expand All @@ -43,6 +43,9 @@ class MapViewModel extends _$MapViewModel {
const LatLng(30, 128.8),
);

/// POI適用後に移動したかどうか
bool _isMarkedAsMoved = false;

/// デフォルトの表示領域に戻す
void reset() => _currencPoi = (
const LatLng(45.8, 145.1),
Expand All @@ -59,13 +62,27 @@ class MapViewModel extends _$MapViewModel {
state.fitBoundsByGlobalPoints([points.$1, points.$2], _renderBox!.size);
}

Future<void> animatedApplyBoundsIfNeeded({
Duration duration = const Duration(milliseconds: 500),
Curve curve = Curves.easeOutCirc,
EdgeInsetsGeometry padding = EdgeInsets.zero,
}) async =>
switch (_isMarkedAsMoved) {
false => animatedApplyBounds(
duration: duration,
curve: curve,
padding: padding,
),
true => {},
};

Future<void> animatedApplyBounds({
Duration duration = const Duration(milliseconds: 500),
Curve curve = Curves.easeOutCirc,
EdgeInsetsGeometry padding = EdgeInsets.zero,
}) {
if (_renderBox == null) {
return Future.value();
throw Exception('MapController is not initialized.');
}
final points = _currencPoi.toGlobalPoints();
return animatedBoundsByGlobalPoints(
Expand Down Expand Up @@ -97,9 +114,7 @@ class MapViewModel extends _$MapViewModel {
);
}

void setBoundsByGlobalPoints(GlobalPoint $1, GlobalPoint $2) {
applyBounds();
}
void resetMarkAsMoved() => _isMarkedAsMoved = false;

/// The minimum velocity for a touch to consider that touch to trigger a fling
/// gesture.
Expand Down Expand Up @@ -188,6 +203,7 @@ class MapViewModel extends _$MapViewModel {
}

void handleScaleUpdate(ScaleUpdateDetails details) {
_isMarkedAsMoved = true;
if (_gestureType == _GestureType.pan) {
// ジェスチャーが最初に開始されたとき、2本の指で行うジェスチャーでも、
// スケールや回転に変化がない場合がある。
Expand Down Expand Up @@ -533,7 +549,6 @@ class MapViewModel extends _$MapViewModel {
_renderBox = renderBox;
}


void registerAnimationControllers({
required AnimationController moveController,
required AnimationController scaleController,
Expand Down
14 changes: 6 additions & 8 deletions lib/core/component/sheet/sheet_floating_action_buttons.dart
Original file line number Diff line number Diff line change
Expand Up @@ -20,18 +20,16 @@ class SheetFloatingActionButtons extends HookWidget {
final SheetController controller;
@override
Widget build(BuildContext context) {
final mediaQuery = useMemoized(
() => MediaQuery.of(context),
[context],
);
final height = mediaQuery.size.height -
(mediaQuery.padding.top + mediaQuery.padding.bottom) -
kToolbarHeight;
final size = MediaQuery.sizeOf(context);
final padding = MediaQuery.paddingOf(context);
final height =
size.height - (padding.top + padding.bottom) - kToolbarHeight;
return AnimatedBuilder(
animation: controller.animation,
builder: (BuildContext context, Widget? child) {
return Positioned(
right: 0,
right: padding.right,
left: padding.left,
bottom: height * controller.animation.value,
child: Container(
margin: const EdgeInsets.all(10),
Expand Down
138 changes: 80 additions & 58 deletions lib/feature/home/view/home_view.dart
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:go_router/go_router.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:lat_lng/lat_lng.dart';
import 'package:sheet/src/sheet.dart';
import 'package:talker_flutter/talker_flutter.dart';

class HomeView extends HookConsumerWidget {
Expand Down Expand Up @@ -86,42 +86,35 @@ class _HomeBodyWidget extends HookConsumerWidget {
@override
Widget build(BuildContext context, WidgetRef ref) {
final vm = ref.watch(homeViewModelProvider);
final brightness = MediaQuery.of(context).platformBrightness;
final moveController = useAnimationController();
final scaleController = useAnimationController();
final globalPointAndZoomLevelController = useAnimationController();
// * mapViewModelへWidgetの各情報を登録しながら 初期化
void init() {
// Widgetのサイズを登録
final renderBox = mapKey.currentContext!.findRenderObject()! as RenderBox;
ref.read(mapViewModelProvider(mapKey).notifier)
..registerRenderBox(
renderBox,
)
..registerAnimationControllers(
moveController: moveController,
scaleController: scaleController,
globalPointAndZoomLevelController: globalPointAndZoomLevelController,
)
..resetMarkAsMoved()
..applyBounds();
}

useEffect(
() {
WidgetsBinding.instance.endOfFrame.then((_) {
// Widgetのサイズを登録
final renderBox =
mapKey.currentContext!.findRenderObject()! as RenderBox;
ref.read(mapViewModelProvider(mapKey).notifier)
..registerRenderBox(
renderBox,
)
..registerAnimationControllers(
moveController: moveController,
scaleController: scaleController,
globalPointAndZoomLevelController:
globalPointAndZoomLevelController,
)
..fitBounds([
const LatLng(45.8, 145.1),
const LatLng(30, 128.8),
])
..applyBounds();
});
WidgetsBinding.instance.endOfFrame.then((_) => init());
return null;
},
[mapKey],
[],
);
final sheetController = vm.sheetController;
final mediaQuery = useMemoized(
() => MediaQuery.of(context),
[context],
);
final mediaQuery = MediaQuery.of(context);

useEffect(
() {
Expand All @@ -137,7 +130,7 @@ class _HomeBodyWidget extends HookConsumerWidget {
(isDark ? MapColorScheme.dark() : MapColorScheme.light())
.backgroundColor;

return Stack(
final child = Stack(
children: [
// background color
Container(
Expand Down Expand Up @@ -175,45 +168,74 @@ class _HomeBodyWidget extends HookConsumerWidget {
final height = mediaQuery.size.height -
(mediaQuery.padding.top + mediaQuery.padding.bottom) -
kToolbarHeight;
ref
.read(mapViewModelProvider(mapKey).notifier)
.animatedApplyBounds(
padding: const EdgeInsets.all(8).add(
EdgeInsets.only(
bottom: height * sheetController.animation.value,
),
ref.read(mapViewModelProvider(mapKey).notifier)
..resetMarkAsMoved()
..animatedApplyBounds(
padding: const EdgeInsets.all(8).add(
EdgeInsets.only(
bottom: switch (sheetController.animation.value) {
< 0.3 => height * sheetController.animation.value,
_ => height * 0.3,
},
),
);
),
);
},
elevation: 4,
child: const Icon(Icons.home),
),
],
),
// Sheet
RepaintBoundary(
child: BasicModalSheet(
controller: sheetController,
children: [
const EewWidgets(),
const SheetStatusWidget(),
const EarthquakeHistorySheetWidget(),
ListTile(
title: const Text('強震モニタ設定'),
leading: const Icon(Icons.settings),
onTap: () => context.push(const KmoniRoute().location),
),
ListTile(
title: const Text('震度配色設定'),
leading: const Icon(Icons.color_lens),
onTap: () =>
context.push(const ColorSchemeConfigRoute().location),
),
const DebugWidget(),
],
),
),
_Sheet(sheetController: sheetController),
],
);

return NotificationListener<SizeChangedLayoutNotification>(
onNotification: (notification) {
WidgetsBinding.instance.endOfFrame.then(
(_) => ref.read(mapViewModelProvider(mapKey).notifier)
..resetMarkAsMoved()
..applyBounds(),
);
return false;
},
child: SizeChangedLayoutNotifier(
child: child,
),
);
}
}

class _Sheet extends StatelessWidget {
const _Sheet({
required this.sheetController,
});

final SheetController sheetController;

@override
Widget build(BuildContext context) {
return RepaintBoundary(
child: BasicModalSheet(
controller: sheetController,
children: [
const EewWidgets(),
const SheetStatusWidget(),
const EarthquakeHistorySheetWidget(),
ListTile(
title: const Text('強震モニタ設定'),
leading: const Icon(Icons.settings),
onTap: () => context.push(const KmoniRoute().location),
),
ListTile(
title: const Text('震度配色設定'),
leading: const Icon(Icons.color_lens),
onTap: () => context.push(const ColorSchemeConfigRoute().location),
),
const DebugWidget(),
],
),
);
}
}
31 changes: 23 additions & 8 deletions lib/feature/home/viewmodel/home_viewmodel.dart
Original file line number Diff line number Diff line change
Expand Up @@ -20,43 +20,58 @@ class HomeViewModel {
}

final HomeViewModelRef ref;
final mapKey = GlobalKey(debugLabel: 'HomeView');
final mapKey = const GlobalObjectKey(MapViewModel);

double height = 0;

SheetController sheetController = SheetController();

int _lastEstimatedIntensityChangedEewsLength = -1;

void onEstimatedIntensityChanged(
List<AnalyzedKmoniObservationPoint> points,
) {
final filtered = _getTargets(points);
// EEWの要素数が変化したかチェック
final length = ref.read(eewTelegramProvider).length;
if (_lastEstimatedIntensityChangedEewsLength != length) {
_lastEstimatedIntensityChangedEewsLength = length;
ref.read(mapViewModelProvider(mapKey).notifier).resetMarkAsMoved();
}
if (filtered == null) {
_resetPoC();
ref.read(MapViewModelProvider(mapKey).notifier).animatedApplyBounds(
ref
.read(mapViewModelProvider(mapKey).notifier)
.animatedApplyBoundsIfNeeded(
padding: const EdgeInsets.all(8).add(
EdgeInsets.only(
bottom: height * sheetController.animation.value,
bottom: switch (sheetController.animation.value) {
< 0.3 => height * sheetController.animation.value,
_ => height * 0.3,
},
),
),
);
return;
}
// 表示領域を変える
ref.read(MapViewModelProvider(mapKey).notifier)
ref.read(mapViewModelProvider(mapKey).notifier)
..setBounds(
filtered,
)
..animatedApplyBounds(
..animatedApplyBoundsIfNeeded(
padding: const EdgeInsets.all(8).add(
EdgeInsets.only(
bottom: height * sheetController.animation.value,
bottom: switch (sheetController.animation.value) {
< 0.3 => height * sheetController.animation.value,
_ => height * 0.3,
},
),
),
);
}

void _resetPoC() {
ref.read(MapViewModelProvider(mapKey).notifier).reset();
ref.read(mapViewModelProvider(mapKey).notifier).reset();
}

/// 震度1以上の観測点のうち、震度が最大~最大-1の観測点を含むLatLngの配列を返す
Expand Down

0 comments on commit 9466109

Please sign in to comment.