BottomSheetDialogFragment实现地图导航弹窗效果

最新推荐文章于 2024-04-24 15:42:15 发布

原创

最新推荐文章于 2024-04-24 15:42:15 发布 · 766 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#移动开发 #android #BottomSheet #地图弹窗

本文介绍了一种自定义BottomSheet弹窗的方法，通过继承BottomSheetDialogFragment并重写关键函数来实现弹窗的动态调整高度及内容。此外，文章还提供了测量视图高度、处理刘海屏等实用技巧。

需求如下：从服务器查询列表在地图上弹窗显示，首次只能显示两条Item，下滑隐藏，上滑动铺满位于titleBar下，点击标记物显示详情，详情内可以点击查看列表

看效果图

在这里插入图片描述

首先想到的是NetScrollView CoordinatorLayout Behavior,当然还有BottomSheet系列，个人比较倾向于BottomSheetDialogFragment，不用在layout 绑定behavior操作，就像一般的Fragment dialog使用一样即可

相关BottomSheetDialogFragment的使用操作先推荐一篇文章科普,很有必要看哟

https://www.jianshu.com/p/7fcec871ea36

根据上面这边博客我先搞一个BaseBottomSheetFragment基类，方便其他地方调用


import android.app.Dialog
import android.content.DialogInterface
import android.graphics.Color
import android.os.Bundle
import android.util.DisplayMetrics
import android.view.*
import androidx.annotation.NonNull
import androidx.coordinatorlayout.widget.CoordinatorLayout
import androidx.fragment.app.FragmentManager
import com.google.android.material.bottomsheet.BottomSheetBehavior
import com.google.android.material.bottomsheet.BottomSheetBehavior.BottomSheetCallback
import com.google.android.material.bottomsheet.BottomSheetDialogFragment
import com.zgph.xz.sitemap.R
import java.lang.reflect.Method
import kotlin.math.min
import kotlin.properties.Delegates


abstract class BaseBottomSheetFragment : BottomSheetDialogFragment() {

    protected var rootView: View? = null

    /**
     * 默认显示item Count ： 0
     */
    protected var itemCount = 0

    /**
     * 设置默认弹出高度peekHeight
     */
    protected var minPeekHeight by Delegates.notNull<Int>()

    /**
     * 设置默认弹出最大高度maxPeekHeight
     */
    protected var maxPeekHeight by Delegates.notNull<Int>()

    /**
     * 控制显示高度、状态值
     */
    private var mBottomSheetBehavior: BottomSheetBehavior<View>? = null

    private lateinit var mBottomSheet: View

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        //弹出BottomSheetDialog背景变暗
        /**
         *
        <style name="TransBottomSheetDialogStyle" parent="Theme.Design.Light.BottomSheetDialog">
        <item name="android:windowFrame">@null</item>
        <item name="android:windowIsFloating">true</item>
        <item name="android:windowIsTranslucent">true</item>
        <item name="android:background">@android:color/transparent</item>
        <item name="android:backgroundDimEnabled">false</item>
        </style>
         *
         */

        //弹出BottomSheetDialog背景变暗解决方案
        setStyle(BottomSheetDialogFragment.STYLE_NORMAL, R.style.pr_TransBottomSheetDialogStyle)
        //item显示几条
        itemCount = getShowItemCount()
        //初始化弹出初始高度和弹出最大高度
        minPeekHeight = BottomSheetDelegate.getMinPeekHeight(context!!,getItemLayoutResId(), getHeaderLayoutResId(), itemCount)
        maxPeekHeight = BottomSheetDelegate.getMaxHeight(activity!!,getTitleBarLayoutResId())
    }

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {

        if (null != rootView) {
            val parent = rootView!!.parent as ViewGroup
            parent?.removeView(rootView)
        } else {
            rootView = inflater.inflate(getContentViewResID(), null)
            initialize()
        }
        initialize()
        return rootView
    }

    override fun onStart() {
        super.onStart()
        initBottomSheet()
    }

    private fun initBottomSheet() {

        val dialog: Dialog? = dialog
        if (dialog != null) {

最低0.47元/天解锁文章