Merge pull request #166 from boostcampwm-2024/refactor/#165-improve-fetch-picks-in-bound

[refactor] 지도 화면 영역의 픽 목록을 가져오는 시점 변경

Author: meanjoo

app/src/main/java/com/squirtles/musicroad/map/MapViewModel.kt

@@ -2,6 +2,7 @@ package com.squirtles.musicroad.map
 
 import android.content.Context
 import android.location.Location
+import android.util.Log
 import androidx.lifecycle.ViewModel
 import androidx.lifecycle.viewModelScope
 import com.naver.maps.geometry.LatLng
@@ -35,6 +36,9 @@ class MapViewModel @Inject constructor(
     private val getCurrentUserUseCase: GetCurrentUserUseCase
 ) : ViewModel() {
 
+    private val _centerLatLng: MutableStateFlow<LatLng?> = MutableStateFlow(null)
+    val centerLatLng = _centerLatLng.asStateFlow()
+
     private var _lastCameraPosition: CameraPosition? = null
     val lastCameraPosition get() = _lastCameraPosition
 
@@ -97,6 +101,11 @@ class MapViewModel @Inject constructor(
         } ?: -1.0
     }
 
+    fun updateCenterLatLng(latLng: LatLng) {
+        _centerLatLng.value = latLng
+    }
+
+    // FIXME: 인자로 Context 받는 것 수정하기
     fun setClickedMarker(context: Context, marker: Marker) {
         viewModelScope.launch {
             marker.toggleSizeByClick(context, true)
@@ -129,34 +138,32 @@ class MapViewModel @Inject constructor(
         }
     }
 
-    fun fetchPicksInBounds(leftTop: LatLng, rightBottom: LatLng, clusterer: Clusterer<MarkerKey>?) {
+    fun fetchPicksInBounds(leftTop: LatLng, clusterer: Clusterer<MarkerKey>?) {
         viewModelScope.launch {
-            val center = LatLng(
-                (leftTop.latitude + rightBottom.latitude) / 2,
-                (leftTop.longitude + rightBottom.longitude) / 2
-            )
-            val radiusInM = leftTop.distanceTo(rightBottom)
-            val fetchPicks = fetchPickInAreaUseCase(center.latitude, center.longitude, radiusInM)
-
-            fetchPicks.onSuccess { pickList ->
-                val newKeyTagMap: MutableMap<MarkerKey, String> = mutableMapOf()
-                pickList.forEach { pick ->
-                    newKeyTagMap[MarkerKey(pick)] = pick.id
-                    _picks[pick.id] = pick
-                }
-                _clickedMarkerState.value.clusterPickList?.let { clusterPickList -> // 클러스터 마커가 선택되어 있는 경우
-                    val updatedPickList = mutableListOf<Pick>()
-                    clusterPickList.forEach { pick ->
-                        _picks[pick.id]?.let { updatedPick ->
-                            updatedPickList.add(updatedPick)
+            _centerLatLng.value?.run {
+                val radiusInM = leftTop.distanceTo(this)
+                fetchPickInAreaUseCase(this.latitude, this.longitude, radiusInM)
+                    .onSuccess { pickList ->
+                        val newKeyTagMap: MutableMap<MarkerKey, String> = mutableMapOf()
+                        pickList.forEach { pick ->
+                            newKeyTagMap[MarkerKey(pick)] = pick.id
+                            _picks[pick.id] = pick
                         }
+                        _clickedMarkerState.value.clusterPickList?.let { clusterPickList -> // 클러스터 마커가 선택되어 있는 경우
+                            val updatedPickList = mutableListOf<Pick>()
+                            clusterPickList.forEach { pick ->
+                                _picks[pick.id]?.let { updatedPick ->
+                                    updatedPickList.add(updatedPick)
+                                }
+                            }
+                            _clickedMarkerState.emit(_clickedMarkerState.value.copy(clusterPickList = updatedPickList.toList())) // 최신 픽 정보로 clusterPickList 업데이트
+                        }
+                        clusterer?.addAll(newKeyTagMap)
+                    }
+                    .onFailure {
+                        // TODO: NoSuchPickInRadiusException일 때
+                        Log.e("MapViewModel", "${it.message}")
                     }
-                    _clickedMarkerState.emit(_clickedMarkerState.value.copy(clusterPickList = updatedPickList.toList())) // 최신 픽 정보로 clusterPickList 업데이트
-                }
-                clusterer?.addAll(newKeyTagMap)
-            }
-            fetchPicks.onFailure {
-                // TODO: NoSuchPickInRadiusException일 때
             }
         }
     }

app/src/main/java/com/squirtles/musicroad/map/NaverMap.kt

@@ -24,6 +24,7 @@ import androidx.core.content.PermissionChecker
 import androidx.lifecycle.Lifecycle
 import androidx.lifecycle.LifecycleEventObserver
 import androidx.lifecycle.compose.LocalLifecycleOwner
+import androidx.lifecycle.compose.collectAsStateWithLifecycle
 import com.google.android.gms.location.FusedLocationProviderClient
 import com.google.android.gms.location.LocationServices
 import com.naver.maps.geometry.LatLng
@@ -68,13 +69,24 @@ fun NaverMap(
     val lifecycleOwner = LocalLifecycleOwner.current
     val coroutineScope = rememberCoroutineScope()
 
+    val centerLatLng by mapViewModel.centerLatLng.collectAsStateWithLifecycle()
+
     LaunchedEffect(lastLocation) {
         // 현재 위치와 마지막 위치가 5미터 이상 차이가 날때만 현위치 기준 반경 100m 픽 정보 개수 불러오기
         lastLocation?.let {
             mapViewModel.requestPickNotificationArea(lastLocation, CIRCLE_RADIUS_METER)
         }
     }
 
+    LaunchedEffect(centerLatLng) {
+        naverMap.value?.projection?.fromScreenLocation(PointF(0F, 0F))?.run {
+            mapViewModel.fetchPicksInBounds(
+                leftTop = this,
+                clusterer = clusterer
+            )
+        }
+    }
+
     DisposableEffect(Unit) {
         clusterer = buildClusterer(context, mapViewModel)
 
@@ -121,16 +133,21 @@ fun NaverMap(
                         mapType = NaverMap.MapType.Navi
                         initMapSettings()
                         initDeviceLocation(
-                            context,
-                            circleOverlay,
-                            fusedLocationClient,
-                            mapViewModel.lastCameraPosition
-                        )
+                            context = context,
+                            circleOverlay = circleOverlay,
+                            fusedLocationClient = fusedLocationClient,
+                            lastCameraPosition = mapViewModel.lastCameraPosition
+                        ) {
+                            mapViewModel.fetchPicksInBounds(
+                                leftTop = this.projection.fromScreenLocation(PointF(0F, 0F)),
+                                clusterer = clusterer
+                            )
+                        }
                         initLocationOverlay(locationSource, locationOverlay)
                         setLocationChangeListener(circleOverlay, mapViewModel)
                         setMapClickListener { mapViewModel.resetClickedMarkerState(context) }
-                        setCameraIdleListener { leftTop, rightBottom ->
-                            mapViewModel.fetchPicksInBounds(leftTop, rightBottom, clusterer)
+                        setCameraIdleListener { centerLatLng ->
+                            mapViewModel.updateCenterLatLng(centerLatLng)
                         }
                         clusterer?.map = this
                     }
@@ -172,7 +189,8 @@ private fun NaverMap.initDeviceLocation(
     context: Context,
     circleOverlay: CircleOverlay,
     fusedLocationClient: FusedLocationProviderClient,
-    lastCameraPosition: CameraPosition?
+    lastCameraPosition: CameraPosition?,
+    fetchPicksInBounds: () -> Unit,
 ) {
     if (checkSelfPermission(context)) {
         fusedLocationClient.lastLocation.addOnSuccessListener { location ->
@@ -181,6 +199,7 @@ private fun NaverMap.initDeviceLocation(
                 setCircleOverlay(circleOverlay, location)
                 lastCameraPosition?.let {
                     moveCamera(CameraUpdate.toCameraPosition(it))
+                    fetchPicksInBounds()
                 } ?: run {
                     moveCamera(CameraUpdate.scrollTo(LatLng(location)))
                     moveCamera(CameraUpdate.zoomTo(INITIAL_CAMERA_ZOOM))
@@ -237,13 +256,10 @@ private fun NaverMap.setMapClickListener(
 
 // 카메라 대기 이벤트 설정
 private fun NaverMap.setCameraIdleListener(
-    fetchPicksInBounds: (LatLng, LatLng) -> Unit
+    updateCenterLatLng: (LatLng) -> Unit
 ) {
     addOnCameraIdleListener {
-        val leftTop = projection.fromScreenLocation(PointF(0f, 0f))
-        val rightBottom =
-            projection.fromScreenLocation(PointF(contentWidth.toFloat(), contentHeight.toFloat()))
-        fetchPicksInBounds(leftTop, rightBottom)
+        updateCenterLatLng(cameraPosition.target)
     }
 }