美文网首页安卓Android知识Android开发
Android - BottomSheetDialog的使用

Android - BottomSheetDialog的使用

作者: c37d344afd22 | 来源:发表于2017-02-08 16:55 被阅读3039次

    BottomSheet出自Android Design库,其实已经出来了很长时间了,但是一直没有使用。

    在去年的时候就开始用到了BottomSheetDialog,讲真刚开始用的时候感觉还是坑挺多的,但是扛不住它效果好啊,所以就自己研究了一下,把一些坑给绕过了。

    一直觉得这个没什么写的,所以一直拖到了现在。下面就开始说。

    从上图就可以看得出来,就是底部弹出了一个dialog,和BottomSheet一样,页面自己写,只需要包含在CoordinatorLayout中就可以,然后加上一个属性app:layout_behavior="@string/bottom_sheet_behavior”,关于XML如下

        <android.support.design.widget.CoordinatorLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
    
            <LinearLayout
                android:id="@+id/bottom_sheet"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/white"
                android:orientation="vertical"
                app:behavior_peekHeight="0dp"
                app:layout_behavior="@string/bottom_sheet_behavior">
    
                <include layout="@layout/view_set_head"/>
            </LinearLayout>
        </android.support.design.widget.CoordinatorLayout>
    

    虽然我们在这里给BottomSheet的布局也就是这里的LinearLayout外面加上了一层CoordinatorLayout,但是一会我们还是要remove掉的。在这里添加是为了使用behavior的属性,能让布局隐藏起来。

    因为这里涉及到BottomSheetDialog的特性,查看BottomSheetDialog的源码

    查看源码我们可以看到是BottomSheetDialog自动封装了一个CoordinatorLayout,所以我们要把我们自定义布局的父布局Remove掉,然后才可以setContentView,不然就会报错。

    我们在代码中可以这么写

    // 查看源码我们可以看到BottomSheetDialog自动封装了一个CoordinatorLayout作为父布局
    // 所以,必须Remove掉父布局以后才能new BottomSheetDialog
     ((ViewGroup) bottomSheetLayout.getParent()).removeView(bottomSheetLayout);//首先remove掉我们自定义布局的父布局
    bottomSheetDialog = new BottomSheetDialog(this);//创建dialog
    bottomSheetDialog.setContentView(bottomSheetLayout);//设置dialog的view
    bottomSheetBehavior = BottomSheetBehavior.from((View) bottomSheetLayout.getParent());//控制dialog的Behavior
    

    在使用的时候就可以bottomSheetDialog.show();
    这样我们就可以在点击事件中成功的show出来dialog了,但是这里还有一个坑,那就是我们点击空白处,dialog已经dismiss掉,但是当我们再次show的时候我们会发现只有背景变暗了,dialog没有show出来。

    这是因为我们dialog确实是dismiss了,但是我们BottomSheet的状态没有改,BottomSheet的状态有五种

    • STATE_COLLAPSED: 默认的折叠状态, bottom sheets只在底部显示一部分布局。显示高度可以通过 app:behavior_peekHeight 设置(默认是0)
    • STATE_DRAGGING : 过渡状态,此时用户正在向上或者向下拖动bottom sheet
    • STATE_SETTLING: 视图从脱离手指自由滑动到最终停下的这一小段时间
    • STATE_EXPANDED: bottom sheet 处于完全展开的状态:当bottom sheet的高度低于CoordinatorLayout容器时,整个bottom sheet都可见;或者CoordinatorLayout容器已经被bottom sheet填满。
    • STATE_HIDDEN : 默认无此状态(可通过app:behavior_hideable 启用此状态),启用后用户将能通过向下滑动完全隐藏 bottom sheet

    这里有两个办法解决,一是监听dialog的dismiss来改变状态,二是在show的时候改变状态,像我这么懒的一般都是show的时候改变状态。

    所以show的时候

    bottomSheetDialog.show();
    bottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
    

    这样就不会出现问题啦!

    然后我觉的这个就没有必要贴代码了吧,因为所有的代码都已经给出来了- -


    最后

    爱小丽,爱Android

    —– BEGIN LICENSE —–
    Michael Barnes
    Single User License
    EA7E-821385
    8A353C41 872A0D5C DF9B2950 AFF6F667
    C458EA6D 8EA3C286 98D1D650 131A97AB
    AA919AEC EF20E143 B361B1E7 4C8B7F04
    B085E65E 2F5F5360 8489D422 FB8FC1AA
    93F6323C FD7F7544 3F39C318 D95E6480
    FCCC7561 8A4A1741 68FA4223 ADCEDE07
    200C25BE DBBC4855 C4CFB774 C5EC138C
    0FEC1CEF D9DCECEC D3A5DAD1 01316C36
    —— END LICENSE ——

    相关文章

      网友评论

        本文标题:Android - BottomSheetDialog的使用

        本文链接:https://www.haomeiwen.com/subject/fifbittx.html