能否让Standard Bottom Sheet停靠至STATE_HALF_EXPANDED等三种状态?
实现Standard Bottom Sheet三种停靠状态(含半展开)
默认情况下,Material Design 2的Standard Bottom Sheet仅支持STATE_EXPANDED(完全展开)和STATE_COLLAPSED(折叠)两种停靠状态,但我们可以通过自定义BottomSheetBehavior来实现添加STATE_HALF_EXPANDED(半展开)状态的支持。
实现步骤:
自定义BottomSheetBehavior
继承官方的BottomSheetBehavior,重写核心方法添加半展开状态的判断逻辑:class ThreeStateBottomSheetBehavior<V : View>(context: Context, attrs: AttributeSet?) : BottomSheetBehavior<V>(context, attrs) { private var halfExpandedRatio = 0.5f // 半展开高度为父容器高度的50%,可自定义 override fun onLayoutChild(parent: CoordinatorLayout, child: V, layoutDirection: Int): Boolean { setHalfExpandedRatio(halfExpandedRatio) return super.onLayoutChild(parent, child, layoutDirection) } override fun onStopNestedScroll(coordinatorLayout: CoordinatorLayout, child: V, target: View, type: Int) { val currentY = child.top val parentHeight = coordinatorLayout.height val halfExpandedHeight = (parentHeight * halfExpandedRatio).toInt() val collapsedHeight = peekHeight when { currentY <= halfExpandedHeight / 2 -> state = STATE_EXPANDED currentY <= collapsedHeight + (halfExpandedHeight - collapsedHeight) / 2 -> state = STATE_HALF_EXPANDED else -> state = STATE_COLLAPSED } } fun setHalfExpandedRatio(ratio: Float) { if (ratio in 0.1f..0.9f) { halfExpandedRatio = ratio super.setHalfExpandedRatio(ratio) } } }布局中绑定自定义Behavior
在BottomSheet容器的布局属性中指定自定义Behavior:<androidx.coordinatorlayout.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"> <!-- 主内容区域 --> <FrameLayout android:layout_width="match_parent" android:layout_height="match_parent"> <!-- 你的主界面内容 --> </FrameLayout> <!-- 三状态Bottom Sheet --> <LinearLayout android:id="@+id/bottom_sheet" android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" app:layout_behavior="com.yourpackage.ThreeStateBottomSheetBehavior" app:behavior_peekHeight="120dp" app:behavior_halfExpandedRatio="0.5"> <!-- Bottom Sheet内容 --> </LinearLayout> </androidx.coordinatorlayout.widget.CoordinatorLayout>主动切换状态(可选)
如果需要在代码中主动触发半展开状态:val bottomSheet = findViewById<LinearLayout>(R.id.bottom_sheet) val behavior = ThreeStateBottomSheetBehavior.from(bottomSheet) behavior.state = BottomSheetBehavior.STATE_HALF_EXPANDED
注意事项:
- 半展开比例建议设置在0.3-0.7之间,保证交互合理性;
- Java版本实现逻辑与Kotlin一致,仅需调整语法适配。
内容的提问来源于stack exchange,提问作者Augusto Carmo
相关产品推荐
相关产品推荐

