오늘은 데이트 이슈로 작업을 많이 진행하지 못 하니 조금만 하고 나가자
화면 기록 2025-01-04 오전 9.41.13.mov
내 네이버 맵의 초기 화면 설정과 인터렉션을 작성해보고 작업을 이어서 진행하고자 한다
뭔가 부족하다…….. 하지만 배포 이 후, 학생들에게 피드백을 받고 진행하는 걸 목표로 일단 넘어가자
일단 하는 김에 하나만 더, 사용자가 자신의 위치로 넘어가는 로직에 똑같이 애니메이션을 적용해 인터렉션을 적용해 보자
Future<void> moveToCurrentLocation() async {
try {
final gpsService = await _locationService.checkGpsService();
if (gpsService) {
final permission = await _locationService.checkLocationPermission();
if (permission || gpsService) {
final currentLocation = await _locationService.getCurrentLocation();
emit(state.copyWith(currentLocation: currentLocation));
// 내위 치 이동 애니메이션
await state.mapController?.updateCamera(
NCameraUpdate.withParams(
zoom: 6.25,
bearing: 0,
tilt: 0,
target: const NLatLng(
36.971336282566874,
127.91767020963579,
),
)..setAnimation(duration: const Duration(milliseconds: 1200)),
);
await state.mapController?.updateCamera(
NCameraUpdate.withParams(
target: NLatLng(
state.currentLocation.latitude,
state.currentLocation.longitude,
),
zoom: 14,
)..setAnimation(duration: const Duration(milliseconds: 1200)),
);
// 종료-------
}
}
} catch (e) {
debugPrint('카메라 이동 실패: $e');
}
}
줌을 먼저 8.25 까지 멀어진게 한다음 1.2초 동안 카메라를 이동하자 1.2 초동안 사용자의 위치로 넘어가게
rotationGesturesEnable: state.screenState == ScreenState.loaded,
scrollGesturesEnable: state.screenState == ScreenState.loaded,
tiltGesturesEnable: state.screenState == ScreenState.loaded,
zoomGesturesEnable: state.screenState == ScreenState.loaded,
stopGesturesEnable: state.screenState == ScreenState.loaded,
그리고 이렇게 사용자가 이동 못하게 추가
추가로 조건부 렌더링에서 자연스러운 ui노출로 변경 aniopacity
IgnorePointer(
ignoring: state.screenState != ScreenState.loaded,
child: Stack(
children: [
Positioned(
top: MediaQuery.of(context).padding.top + 85,
left: 0,
right: 0,
child: AnimatedOpacity(
opacity:
state.screenState != ScreenState.loaded ? 0.0 : 1.0,
duration: const Duration(milliseconds: 420),
child: SearchCategorySection(
textBarColor: true,
textBarText: '주변 매장을 검색해보세요',
naverMapCategory: state.naverMapCategory,
selectedCategory: state.selectedCategory,
onCategorySelected: (category) {
context
.read<NaverMapCubit>()
.updateSelectedCategory(category, context);
},
),
),
),
Positioned(
right: 20,
bottom: 70 + MediaQuery.of(context).padding.bottom,
child: AnimatedOpacity(
opacity:
state.screenState != ScreenState.loaded ? 0.0 : 1.0,
duration: const Duration(milliseconds: 420),
child: const CurrentLocationButton(),
),
),
],
),
),
물론 여기에는 이그노어 포인트가 들어가 터치가 안되게