日本免费高清视频-国产福利视频导航-黄色在线播放国产-天天操天天操天天操天天操|www.shdianci.com

學(xué)無(wú)先后,達(dá)者為師

網(wǎng)站首頁(yè) 編程語(yǔ)言 正文

Android學(xué)習(xí)之BottomSheetDialog組件的使用_Android

作者:JulyYu ? 更新時(shí)間: 2022-08-12 編程語(yǔ)言

基本介紹

BottomSheetDialog是底部操作控件,可在屏幕底部創(chuàng)建一個(gè)支持滑動(dòng)關(guān)閉視圖。

目前依賴使用如下:

implementation 'com.google.android.material:material:1.4.0'

基礎(chǔ)使用

BottomSheetDialog需要為它添加視圖內(nèi)容,類似Dialog,且BottomSheetDialog的高度由自定義視圖決定。

         var text = TextView(this@UIBottomSheetAC)
         text.text = "BottomSheetDialog"
         var linearLayout = LinearLayout(this@UIBottomSheetAC)
         linearLayout.addView(text)
         linearLayout.setBackgroundColor(Color.YELLOW)
         linearLayout.layoutParams = LinearLayout.LayoutParams(-1,500)
         val bottomSheetDialog =
             BottomSheetDialog(context, R.style.bottom_sheet_dialog)
         bottomSheetDialog.setContentView(linearLayout)
         bottomSheetDialog.show()

其他功能實(shí)現(xiàn)

圓角樣式實(shí)現(xiàn)

BottomSheetDialog官方默認(rèn)樣式是矩形彈窗并不帶圓角設(shè)置。但在日常開(kāi)發(fā)中會(huì)遇到需要圓角彈窗設(shè)計(jì)要求需要對(duì)BottomSheetDialog默認(rèn)樣式做一些調(diào)整才能實(shí)現(xiàn)。

BottomSheetDialog樣式文件

<style name="bottom_sheet_dialog" parent="Theme.Design.Light.BottomSheetDialog">
    <item name="bottomSheetStyle">@style/bottom_sheet_style_wrapper</item>
</style>
<style name="bottom_sheet_style_wrapper" parent="Widget.Design.BottomSheet.Modal">
    <item name="android:background">@android:color/transparent</item>
</style>

布局背景圓角

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="@android:color/holo_blue_light" />
    <corners
        android:topLeftRadius="15dp"
        android:topRightRadius="15dp" />
</shape>

代碼配置

// 視圖背景增加圓角樣式
linearLayout.background = getDrawable(R.drawable.ui_shape_top_radius15)
// bottomSheetDialog設(shè)置透明背景樣式
val bottomSheetDialog =
    BottomSheetDialog(context, R.style.bottom_sheet_dialog)

去彈窗外部遮罩陰影

增加android:backgroundDimEnabled屬性為false實(shí)現(xiàn)無(wú)背景陰影遮罩效果。

<style name="bottom_sheet_dialog" parent="Theme.Design.Light.BottomSheetDialog">
    <item name="bottomSheetStyle">@style/bottom_sheet_style_wrapper</item>
    <item name="android:backgroundDimEnabled">false</item>
</style>

帶陰影

不帶陰影

關(guān)閉觸發(fā)設(shè)置

  • 是否支持拖拽關(guān)閉通過(guò)設(shè)置setCancelable方法實(shí)現(xiàn)。
  • 是否支持點(diǎn)擊視圖外部關(guān)閉彈窗通過(guò)setCanceledOnTouchOutside方法實(shí)現(xiàn)
bottomSheetDialog.setCancelable(false)
bottomSheetDialog.setCanceledOnTouchOutside(true)

列表視圖使用

使用列表功能也是可以直接實(shí)現(xiàn),添加ListView即可,列表高度可設(shè)置ViewGroup.LayoutParams實(shí)現(xiàn)(默認(rèn)情況下若列表數(shù)據(jù)較多會(huì)撐滿整個(gè)屏幕)。

Button(this).run {
    it.addView(this)
    text = "BottomSheetListDialog"
    setOnClickListener {
        var listView = ListView(this@UIBottomSheetAC)
        listView.adapter =
            ArrayAdapter<String>(
                this@UIBottomSheetAC,
                android.R.layout.simple_list_item_1,
                values
            )
        var coordinatorLayout = CoordinatorLayout(this@UIBottomSheetAC)
        val params = ViewGroup.LayoutParams(
            resources.displayMetrics.widthPixels,
            resources.displayMetrics.heightPixels
        )
        coordinatorLayout.addView(listView)
        val bottomSheetDialog =
            BottomSheetDialog(context, R.style.bottom_sheet_dialog)
        bottomSheetDialog.setContentView(coordinatorLayout,params)
        bottomSheetDialog.show()
    }
}

但使用BottomSheetBehavior要求根布局必須是CoordinatorLayout否則會(huì)報(bào)錯(cuò)。

 val bottomSheetBehavior = BottomSheetBehavior.from(coordinatorLayout)
        bottomSheetBehavior.peekHeight = resources.displayMetrics.heightPixels * 3 / 4
        bottomSheetBehavior.addBottomSheetCallback(object :
            BottomSheetBehavior.BottomSheetCallback() {
            override fun onSlide(bottomSheet: View, slideOffset: Float) {

            }

            override fun onStateChanged(bottomSheet: View, newState: Int) {
                if (newState == BottomSheetBehavior.STATE_HIDDEN) {
                    bottomSheetDialog.dismiss()
                }
            }
        })

原文鏈接:https://juejin.cn/post/7111350570140565512

欄目分類
最近更新