Android BottomSheets的使用

    xiaoxiao2021-12-10  31

    1.布局文件

    <?xml version="1.0" encoding="utf-8"?> <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <LinearLayout android:id="@+id/layout" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="#EFEFEF" android:orientation="vertical" android:paddingLeft="15dp" android:paddingRight="15dp" app:behavior_peekHeight="5dp" app:layout_behavior="@string/bottom_sheet_behavior"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:minHeight="30dp" android:text="选取方式" android:textColor="?attr/colorAccent" /> <Button android:id="@+id/photo" style="@style/Widget.AppCompat.Button.Borderless.Colored" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:minHeight="48dp" android:text="照片" android:textColor="@android:color/darker_gray" /> <View android:layout_width="match_parent" android:layout_height="1dp" android:background="@android:color/darker_gray" /> <Button android:id="@+id/camera" style="@style/Widget.AppCompat.Button.Borderless.Colored" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:minHeight="48dp" android:text="相机" android:textColor="@android:color/darker_gray" /> <View android:layout_width="match_parent" android:layout_height="1dp" android:background="@android:color/darker_gray" /> <Button android:id="@+id/tv_dialog_cancel" style="@style/Widget.AppCompat.Button.Borderless.Colored" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center" android:text="取消" android:textColor="?attr/colorAccent" /> </LinearLayout> <android.support.design.widget.FloatingActionButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="16dp" android:onClick="fab" android:src="@android:drawable/ic_dialog_email" app:layout_anchor="@id/layout" app:layout_anchorGravity="right|top" app:pressedTranslationZ="10dp" /> </android.support.design.widget.CoordinatorLayout> 2.代码

    public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); } public void fab(View view) { BottomSheetBehavior behavior = BottomSheetBehavior.from(findViewById(R.id.layout)); if (behavior.getState() == BottomSheetBehavior.STATE_EXPANDED) { behavior.setState(BottomSheetBehavior.STATE_COLLAPSED); } else { behavior.setState(BottomSheetBehavior.STATE_EXPANDED); } } } 3.解释

    根布局必须是CoordinatorLayout协调布局,给要在底部显示的布局的根布局加上behavior

    <span style="color:#ff6666;">app:layout_behavior="@string/bottom_sheet_behavior"</span>同时加上 app:behavior_peekHeight="5dp"这个<span style="color: rgb(51, 51, 51); font-family: 'lucida grande', 'lucida sans unicode', lucida, helvetica, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif; font-size: 16px; line-height: 21.76px;">peekHeight是当Bottom Sheets关闭的时候,底部下表我们能看到的高度</span><pre name="code" class="html"><p style="box-sizing: border-box; border: 0px; margin-top: 0px; margin-bottom: 15px; padding-top: 0px; padding-bottom: 0px; line-height: 1.7; color: rgb(51, 51, 51); font-family: 'lucida grande', 'lucida sans unicode', lucida, helvetica, 'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif; font-size: 16px;">hideable 是当我们拖拽下拉的时候,bottom sheet是否能全部隐藏。 如果你需要监听Bottom Sheets回调的状态,可以通过setBottomSheetCallback来实现,onSlide方法是拖拽中的回调,根据slideOffset可以做一些动画 onStateChanged方法可以监听到状态的改变,总共有5种</p><ul class=" list-paddingleft-2" style="box-sizing: border-box; border: 0px; margin: 0px 0px 16px 25px; padding: 0px 0px 0px 2em; list-style: none; color: rgb(51, 51, 51); font-size: 16px; line-height: 25.6px; font-family: 'Helvetica Neue', Helvetica, 'Segoe UI', Arial, freesans, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';"><li style="box-sizing: border-box; border: 0px; margin: 0px; padding: 0px; list-style: disc;"><p style="box-sizing: border-box; border: 0px; margin-top: 0px; margin-bottom: 0px; padding-top: 0px; padding-bottom: 0px; line-height: 1.7;">STATE_COLLAPSED: 关闭Bottom Sheets,显示peekHeight的高度,默认是0</p></li><li style="box-sizing: border-box; border: 0px; margin: 0px; padding: 0px; list-style: disc;"><p style="box-sizing: border-box; border: 0px; margin-top: 0px; margin-bottom: 0px; padding-top: 0px; padding-bottom: 0px; line-height: 1.7;">STATE_DRAGGING: 用户拖拽Bottom Sheets时的状态</p></li><li style="box-sizing: border-box; border: 0px; margin: 0px; padding: 0px; list-style: disc;"><p style="box-sizing: border-box; border: 0px; margin-top: 0px; margin-bottom: 0px; padding-top: 0px; padding-bottom: 0px; line-height: 1.7;">STATE_SETTLING: 当Bottom Sheets view释放时记录的状态。</p></li><li style="box-sizing: border-box; border: 0px; margin: 0px; padding: 0px; list-style: disc;"><p style="box-sizing: border-box; border: 0px; margin-top: 0px; margin-bottom: 0px; padding-top: 0px; padding-bottom: 0px; line-height: 1.7;">STATE_EXPANDED: 当Bottom Sheets 展开的状态</p></li><li style="box-sizing: border-box; border: 0px; margin: 0px; padding: 0px; list-style: disc;"><p style="box-sizing: border-box; border: 0px; margin-top: 0px; margin-bottom: 0px; padding-top: 0px; padding-bottom: 0px; line-height: 1.7;">STATE_HIDDEN: 当Bottom Sheets 隐藏的状态</p></li></ul>

    com.android.support:design:24.2.1,导入包的版本不同,结果不同,24.2.1以前默认bottom sheet的peekHeight是0,所以默认情况下是隐藏状态,而24.2.1版本是默认不是0dp,所以要想刚开始就是隐藏状态就得加app:behavior_peekHeight="0dp",否则点击floatingActinButton 按钮不起作用  还可以给bottom sheet加上回调 behavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() { @Overridepublic void onStateChanged(@NonNull View bottomSheet, int newState) { if (newState == BottomSheetBehavior.STATE_COLLAPSED || newState == BottomSheetBehavior.STATE_HIDDEN) { recyclerView.setVisibility(View.GONE); } } @Overridepublic void onSlide(@NonNull View bottomSheet, float slideOffset) { recyclerView.setVisibility(View.VISIBLE); ViewCompat.setAlpha(recyclerView, slideOffset); } }); 第一个方法在bottom sheet状态改变时调用,第二个在滑动过程中调用

    转载请注明原文地址: https://ju.6miu.com/read-700403.html

    最新回复(0)