android通用的屏幕底部弹出的选择框

时间:2024-04-02 18:32:27

step1:创建一个底部弹出的BottomListDialog,弹出动画(R.style.dialog_popFromBottom)可以自己设计

class BottomListDialog : AppCompatDialogFragment() {

    private lateinit var lstShow: ListView
    private lateinit var btnCancel: TextView

    private var itemList: Array<String>? = null
    private var itemIconList: Array<Int>? = null

    private var mComposite: CompositeDisposable = CompositeDisposable()

    override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
        val dialog = Dialog(activity!!, R.style.dialog_popFromBottom)
        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE) // 设置Content前设定
        dialog.setContentView(R.layout.dialog_bottom_list)
        dialog.setCanceledOnTouchOutside(true) // 外部点击取消

        // 设置宽度为屏宽, 靠近屏幕底部。
        val window = dialog.window
        val lp = window!!.attributes
        lp.gravity = Gravity.BOTTOM // 紧贴底部
        lp.width = WindowManager.LayoutParams.MATCH_PARENT // 宽度持平
        window.attributes = lp
        initView(dialog)

        if (savedInstanceState != null) {
            itemList = savedInstanceState.getStringArray("itemList")
            itemIconList = GsonFormatter.fromJson(savedInstanceState.getString("itemIconList")!!, Array<Int>::class.java)
        }

        if (itemIconList?.size == itemList?.size) {
            val list = ArrayList<Map<String, Any>>()
            for (i in itemList!!.indices) {
                val map = HashMap<String, Any>()
                map["item"] = itemList!![i]
                map["itemIcon"] = itemIconList!![i]
                list.add(map)
            }
            lstShow.adapter = SimpleAdapter(context, list, R.layout.item_simple_list, arrayOf("item", "itemIcon"), intArrayOf(R.id.txtShow, R.id.imgIcon))
        } else {
            lstShow.adapter = ArrayAdapter(context!!, R.layout.item_simple_list, R.id.txtShow, itemList!!)
        }

        mComposite.addAll(
                RxView.clicks(btnCancel)
                        .throttleFirst(1, TimeUnit.SECONDS)
                        .subscribe({
                            dismiss()
                        }, {
                            Timber.e(it)
                        })
        )

        lstShow.onItemClickListener = AdapterView.OnItemClickListener { parent, view, position, id ->
            onItemClickListener.onItemClick(parent, view, position, id, itemList!![position], itemList!!)
            dismiss()
        }

        return dialog
    }

    private fun initView(dialog: Dialog) {
        lstShow = dialog.findViewById(R.id.lstShow)
        btnCancel = dialog.findViewById(R.id.tv_cancel)
    }

    fun setItemList(itemList: ArrayList<String>): BottomListDialog {
        this.itemList = itemList.toTypedArray()
        return this
    }

    fun setItemIconList(itemIconList: ArrayList<Int>): BottomListDialog {
        this.itemIconList = itemIconList.toTypedArray()
        return this
    }

    override fun onSaveInstanceState(outState: Bundle) {
        super.onSaveInstanceState(outState)
        outState.putStringArray("itemList", itemList)
        outState.putString("itemIconList", GsonFormatter.toJson(itemIconList!!))
    }

    override fun onDestroyView() {
        mComposite.clear()
        super.onDestroyView()
    }

    interface OnItemClickListener {
        fun onItemClick(parent: AdapterView<*>?, view: View?, position: Int, id: Long, selectItem: String, itemList: Array<String>)
    }

    private lateinit var onItemClickListener: OnItemClickListener

    fun setOnItemClickListener(onItemClickListener: OnItemClickListener): BottomListDialog {
        this.onItemClickListener = onItemClickListener
        return this
    }
}

step2:很简单的xml,listview的item样式可以按照自己需要*设计

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@android:color/transparent"
    android:orientation="vertical">

    <ListView
        android:id="@+id/lstShow"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white"
        android:listSelector="@android:color/transparent"
        android:divider="@color/dividerColor"
        android:dividerHeight="1px"
        android:scrollbars="none" />

    <TextView
        android:id="@+id/tv_cancel"
        android:layout_width="match_parent"
        android:layout_height="142px"
        android:layout_marginTop="22px"
        android:background="@color/white"
        android:gravity="center"
        android:text="@string/cancel"
        android:textColor="@color/textColorPrimary"
        android:textSize="15sp" />
</LinearLayout>

step3:使用

RxView.clicks(tvChildRelationShip)
                .subscribe({
                    BottomListDialog().setItemList(
                        arrayListOf(
                            getString(R.string.father),
                            getString(R.string.mather),
                            getString(R.string.grandpa),
                            getString(R.string.grandma),
                            getString(R.string.grand_father),
                            getString(R.string.grand_mather)
                        )
                    ).setOnItemClickListener(object : BottomListDialog.OnItemClickListener {
                        override fun onItemClick(
                            parent: AdapterView<*>?,
                            view: View?,
                            position: Int,
                            id: Long,
                            selectItem: String,
                            itemList: Array<String>
                        ) {
                            tvChildRelationShip.text = selectItem
                            selectedRelationShip = selectItem
                        }

                    }).show(supportFragmentManager, "bottomListDialog")
                }) {
                    Timber.e(it)
                }

效果:
android通用的屏幕底部弹出的选择框