[안드로이드&코틀린] 에어비앤비#3, 공유하기 기능, 마커 클릭시 viewPager전환, viewPager전환시 마커 표시, locationButton, 위치 권한 받기

[안드로이드&코틀린] 에어비앤비#2, Mocky로 임시 API 만들기, Glide에서 CenterCrop사용하기, Glide로 corne

 

 

# 공유하기 기능

private val housePageApdater = HouseViewPagerAdapter(pageClickedCallback = {
    val intent = Intent().apply {
        action = Intent.ACTION_SEND
        putExtra(Intent.EXTRA_TEXT,"지금 ${it.price}에 ${it.title}을 예약하세요!")
        type = "text/plain"
    }
    startActivity(intent)

})

저번에 읽던 안드로이드 관련도서에서, 액티비티간 전환도 결국 인탠트라는걸 사용하는데 이게 아주 독립적이라는 글을 봤던거 같다. 여튼 viewPager를 선택시 클릭 콜백함수를 만들어준다. 

 

# ViewPager전환시 카메라(마커) 이동

viewPager.registerOnPageChangeCallback(object : ViewPager2.OnPageChangeCallback(){
    override fun onPageSelected(position: Int) {
        super.onPageSelected(position)

        val selectedModel = housePageApdater.currentList[position]
        val cameraUpdate = CameraUpdate.scrollTo(LatLng(selectedModel.lat,selectedModel.lng)).animate(CameraAnimation.Easing)
        naverMap.moveCamera(cameraUpdate)
    }
})

 

# 마커 클릭시 ViewPager전환

메인액티비티에서 Overlay.OnClickListener를 상속받는다.

class MainActivity : AppCompatActivity(), OnMapReadyCallback, Overlay.OnClickListener{}

override fun onClick(overlay: Overlay): Boolean {
    overlay.tag
    Log.d("onClick",overlay.tag.toString())

    val selectedModel = housePageApdater.currentList.firstOrNull{
        it.id == overlay.tag
    }

    selectedModel?.let{
        val pos = housePageApdater.currentList.indexOf(it)
        viewPager.currentItem = pos
    }

    return true
}

그리고 override하여 구현하면 된다. overlay가 뭔지 몰라서 좀 찾아봤는데 naver에서 제동하는 기능이었다. Marker와 같이 맵 위에 있는 것들 눌리면 반응하는 것이다. 

private fun getHouseDataAPI() {
    startProgressbar()
    retrofitService = retrofit.create(RetrofitService::class.java)
    retrofitService.getHouseData().enqueue(object : Callback<HouseDto>{
        override fun onResponse(call: Call<HouseDto>, response: Response<HouseDto>) {
            if(response.isSuccessful.not()) {
                Toast.makeText(this@MainActivity,"데이터 응답 실패",Toast.LENGTH_SHORT).show()
                return
            }
            response.body()?.let{ dto ->
                dto.items.forEach { data ->
                    Log.d("Retrofit", data.toString())
                    val marker = Marker()
                    marker.position = LatLng(data.lat,data.lng)
                    marker.map = naverMap
                    marker.tag = data.id // 태그 달아줌!
                    marker.icon = MarkerIcons.BLACK
                    marker.iconTintColor = Color.RED
                    // TODO 마커 온클릭 리스너 달아주기
                    marker.onClickListener = this@MainActivity
                }

                housePageApdater.submitList(dto.items)
                houseRecyclerViewApdater.submitList(dto.items)
                bottomSheetTitle.text = "${dto.items.size}개 방보기"
                stopProgressbar()

            }
        }

여기서 marker마다 tag를 달아줬는데, 이 태그를 활용하여 현재 model를 알아낸다. 

 

# locationButton 위치 바꾸기, 위치 권한 받기

locationButtton을 xml에 아래와 같이 추가해준다.

<com.naver.maps.map.widget.LocationButtonView
  android:id="@+id/naverLocationButton"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  tools:layout_height="50dp"
  tools:layout_width="50dp"
  android:layout_marginTop="10dp"
  android:layout_marginStart="10dp"
  android:layout_gravity="top"/>

 

isLocationButtonEanbled를 false로 하여 네이버에서 기본으로 제공하는 버튼을 사용하지 않고, 내가 위치를 지정해준 buttonView에 재할당 시킨다. 

// 현위치 받아오기
val uiSettings = naverMap.uiSettings
uiSettings.isLocationButtonEnabled = false

// 로케이션 버튼 재할당
locationButton.map = naverMap

naverMap.locationTrackingMode = LocationTrackingMode.Face

// 현재 위치 설정
locationSource = FusedLocationSource(this@MainActivity, CURRENT_LOCATION_CODE)
naverMap.locationSource = locationSource

override fun onRequestPermissionsResult(
    requestCode: Int,
    permissions: Array<out String>,
    grantResults: IntArray
) {
    super.onRequestPermissionsResult(requestCode, permissions, grantResults)
    if(requestCode != CURRENT_LOCATION_CODE) {
        return
    }
    if (locationSource.onRequestPermissionsResult(requestCode,permissions,grantResults)) {
        if(!locationSource.isActivated) {
            naverMap.locationTrackingMode = LocationTrackingMode.None
        }
        return
    }
}

위 기능을 사용하기 위해서 구글에서 제공하는 라이브러리를 꼭 추가해줘야 하며, 

//google location
implementation 'com.google.android.gms:play-services-location:20.0.0'

매니페스트에 아래 두개를 추가해줘야 한다.

<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>

 

# 마치며

ViewPager2의 기능이 꽤 강력한거 같고, 실제 어플들에서 엄청 많이 쓰이는것 같다. 안드로이드 더 열심히 공부해야겠다.