頭のなかみをそのまま筆に

東大生の頭の中、少しおすそ分け。

RecyclerViewとMarkerを対応させる(Kotlin)

作りたいもの

RecyclerViewをスクロールするとそのアイテムに対応するGoogle MapのMarkerに移動し、またMap上でMarkerをタップするとRecyclerViewがアイテムまでスクロールしてくれるやつ。

f:id:ImagawaHibana:20191222233212g:plain
こんなやつ
CardViewとSnaphelperも使用していますがその説明は割愛します。

環境

Android Studio Kotlin Maps SDK for Android

方法

RecyclerView -> Marker

スクロール量でRecyclerView上の順番を判定し、そのアイテムの位置までMapを移動。

//recycler -> marker
recyclerView.addOnScrollListener(object :RecyclerView.OnScrollListener(){//スクロールでマーカーに移動
    override fun onScrolled(recyclerView: RecyclerView, dx: Int, dy: Int) {//スクロールした量でposition判定
        super.onScrolled(recyclerView, dx, dy)
        val offset = recyclerView.computeHorizontalScrollOffset()
        val itemWidth = cafeCardRoot.width
        val edgeMargin = (recyclerView.width - itemWidth)/2
        val position = (offset + edgeMargin) / (itemWidth + edgeMargin/2)

        if (myCafesData[position].latitude == "" || myCafesData[position].longitude == "") {
            return
        }else{
            val moveLatLng = LatLng(myCafesData[position].latitude.toDouble(),myCafesData[position].longitude.toDouble())
            mMap.animateCamera(CameraUpdateFactory.newLatLngZoom(moveLatLng, 16F))
        }
    }
})

Marker -> RecyclerView

マーカーの順番を判定してそのアイテムまでスクロール。

//marker -> recycler
mMap.setOnMarkerClickListener(object : GoogleMap.OnMarkerClickListener{
    override fun onMarkerClick(marker: Marker?): Boolean {
        val markerPosition = marker?.position
        var selectedMarker = -1
        for (i in 0..myCafesData.size-1) {
            if (myCafesData[i].latitude == "" || myCafesData[i].longitude == "") {
                continue
            } else {
                if (markerPosition?.latitude == myCafesData[i].latitude.toDouble() && markerPosition.longitude == myCafesData[i].longitude.toDouble()) {
                    selectedMarker = i//Markerのposition判定
                }
            }
        }
        recyclerView.smoothScrollToPosition(selectedMarker)//scroll
        return false
    }
}
)

課題

RecyclerViewとMarkerが直接連結してる訳ではないので、Recycler->Markerでマーカーのサイズ変えたりすることができない。 アイテムのデータにRecyclerViewとMarkerの情報を持たせるのですかね?

上記の課題の解決方法をご教授いただければ幸いです。お願いいたします!