android支持设计底部sheet如何设置最大展开高度?
How to set maximum expanded height in android support design bottom sheet?
我已经展示了底部 sheet 布局,其 peek 高度设置为 100dp。但是我怎样才能限制我的底部 sheet 只扩展到 500dp?这是我的示例布局:
<android.support.design.widget.CoordinatorLayout
android:id="@+id/coordinator"
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">
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MapsActivity" />
<android.support.v4.widget.NestedScrollView
android:id="@+id/design_bottom_sheet"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000"
app:behavior_hideable="true"
app:behavior_peekHeight="100dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_margin="@dimen/activity_horizontal_margin"
app:layout_anchor="@+id/design_bottom_sheet"
app:layout_anchorGravity="top|right|end"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.design.widget.CoordinatorLayout>
除了我的问题,我怎样才能禁止用户上下拖动底部 sheet?
阻止底部 sheet 向上移动整个屏幕很简单,只需将 NestedScrollView 的 layout_height
设置为 500dp,您可能还想将其设置为 layout_gravity="bottom"
<android.support.v4.widget.NestedScrollView
android:id="@+id/design_bottom_sheet"
android:layout_width="match_parent"
android:layout_height="500dp"
android:background="#000000"
android:layout_gravity="bottom"
app:behavior_hideable="true"
app:behavior_peekHeight="100dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
如果您不想向上拖动视图,则需要将 behavior_peekHeight
和 layout_height
设置为相同的值。
要阻止视图向下拖动,behavior_hideable
标志只需将其设置为 false
您可以将参数 "maxHeight" 设置为底部 sheet 的根视图组。
android:maxHeight=500dp
与 ConstraintLayout 作为根布局配合使用效果很好。
以上解决方案对我不起作用,所以我通过
解决了
1. 在底部 sheet 布局的根视图中添加 app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior"
。
2. 底部自定义样式 sheet:
<style name="AppBottomSheetDialogTheme" parent="Theme.MaterialComponents.BottomSheetDialog">
<item name="bottomSheetStyle">@style/AppModalStyle</item>
</style>
<style name="AppModalStyle" parent="Widget.MaterialComponents.BottomSheet">
<item name="behavior_peekHeight">600dp</item>
</style>
3. 并在 Activity 或 Fragment by
中使用它
val mBottomSheetDialog = BottomSheetDialog(this, R.style.AppBottomSheetDialogTheme)
val inflater = this.layoutInflater
val sheetView = inflater.inflate(R.layout.bottom_sheet_layout, null)
mBottomSheetDialog.setContentView(sheetView)
mBottomSheetDialog.show()
如果使用 BottomSheetDialogFragment:
在我的例子中,我使用的是 BottomSheetDialogFragment 并通过在我的 BottomSheetFragment
中覆盖 OnCreateDialog 方法获取其参考来修改底部 sheet 窥视高度
@NonNull @Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
dialog = (BottomSheetDialog) super.onCreateDialog(savedInstanceState);
dialog.setOnShowListener(new DialogInterface.OnShowListener() {
@Override
public void onShow(DialogInterface dialog) {
BottomSheetDialog bottom_dialog = (BottomSheetDialog) dialog;
FrameLayout bottomSheet = (FrameLayout) bottom_dialog.findViewById(com.google.android.material.R.id.design_bottom_sheet);
assert bottomSheet != null;
//BottomSheetBehavior.from(bottomSheet).setState(BottomSheetBehavior.STATE_EXPANDED);
DisplayMetrics displayMetrics = requireActivity().getResources().getDisplayMetrics();
int height = displayMetrics.heightPixels;
int maxHeight = (int) (height*0.80);
BottomSheetBehavior.from(bottomSheet).setPeekHeight(maxHeight);
}
});
return dialog;
}
出于某种原因,接受的答案对我不起作用。可能是因为我没有使用 fragment
和 NestedScrollView
作为 BottomSheet
中的布局。无论如何,就我而言,解决方案是限制 CoordinatorLayout
:
的大小
<ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Your main content here -->
</ConstarintLayout>
<CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="MAX SIZE OF BOTTOM SHEET">
<YourBottomSheetLayout>
app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</CoordinatorLayout>
</ConstarintLayout>
您可以使用 BottomSheetBehavior
中的 setMaxHeight 方法(此方法应在 show()
方法之前调用)
bottomSheetDialog.behavior.maxHeight = 1000 // set max height when expanded in PIXEL
bottomSheetDialog.behavior.peekHeight = 400 // set default height when collapsed in PIXEL
我已经展示了底部 sheet 布局,其 peek 高度设置为 100dp。但是我怎样才能限制我的底部 sheet 只扩展到 500dp?这是我的示例布局:
<android.support.design.widget.CoordinatorLayout
android:id="@+id/coordinator"
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">
<fragment xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/map"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MapsActivity" />
<android.support.v4.widget.NestedScrollView
android:id="@+id/design_bottom_sheet"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000000"
app:behavior_hideable="true"
app:behavior_peekHeight="100dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_margin="@dimen/activity_horizontal_margin"
app:layout_anchor="@+id/design_bottom_sheet"
app:layout_anchorGravity="top|right|end"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</android.support.design.widget.CoordinatorLayout>
除了我的问题,我怎样才能禁止用户上下拖动底部 sheet?
阻止底部 sheet 向上移动整个屏幕很简单,只需将 NestedScrollView 的 layout_height
设置为 500dp,您可能还想将其设置为 layout_gravity="bottom"
<android.support.v4.widget.NestedScrollView
android:id="@+id/design_bottom_sheet"
android:layout_width="match_parent"
android:layout_height="500dp"
android:background="#000000"
android:layout_gravity="bottom"
app:behavior_hideable="true"
app:behavior_peekHeight="100dp"
app:layout_behavior="android.support.design.widget.BottomSheetBehavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginBottom="5dp"
android:background="#e444ff" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
如果您不想向上拖动视图,则需要将 behavior_peekHeight
和 layout_height
设置为相同的值。
要阻止视图向下拖动,behavior_hideable
标志只需将其设置为 false
您可以将参数 "maxHeight" 设置为底部 sheet 的根视图组。
android:maxHeight=500dp
与 ConstraintLayout 作为根布局配合使用效果很好。
以上解决方案对我不起作用,所以我通过
解决了1. 在底部 sheet 布局的根视图中添加 app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior"
。
2. 底部自定义样式 sheet:
<style name="AppBottomSheetDialogTheme" parent="Theme.MaterialComponents.BottomSheetDialog">
<item name="bottomSheetStyle">@style/AppModalStyle</item>
</style>
<style name="AppModalStyle" parent="Widget.MaterialComponents.BottomSheet">
<item name="behavior_peekHeight">600dp</item>
</style>
3. 并在 Activity 或 Fragment by
中使用它 val mBottomSheetDialog = BottomSheetDialog(this, R.style.AppBottomSheetDialogTheme)
val inflater = this.layoutInflater
val sheetView = inflater.inflate(R.layout.bottom_sheet_layout, null)
mBottomSheetDialog.setContentView(sheetView)
mBottomSheetDialog.show()
如果使用 BottomSheetDialogFragment:
在我的例子中,我使用的是 BottomSheetDialogFragment 并通过在我的 BottomSheetFragment
中覆盖 OnCreateDialog 方法获取其参考来修改底部 sheet 窥视高度@NonNull @Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
dialog = (BottomSheetDialog) super.onCreateDialog(savedInstanceState);
dialog.setOnShowListener(new DialogInterface.OnShowListener() {
@Override
public void onShow(DialogInterface dialog) {
BottomSheetDialog bottom_dialog = (BottomSheetDialog) dialog;
FrameLayout bottomSheet = (FrameLayout) bottom_dialog.findViewById(com.google.android.material.R.id.design_bottom_sheet);
assert bottomSheet != null;
//BottomSheetBehavior.from(bottomSheet).setState(BottomSheetBehavior.STATE_EXPANDED);
DisplayMetrics displayMetrics = requireActivity().getResources().getDisplayMetrics();
int height = displayMetrics.heightPixels;
int maxHeight = (int) (height*0.80);
BottomSheetBehavior.from(bottomSheet).setPeekHeight(maxHeight);
}
});
return dialog;
}
出于某种原因,接受的答案对我不起作用。可能是因为我没有使用 fragment
和 NestedScrollView
作为 BottomSheet
中的布局。无论如何,就我而言,解决方案是限制 CoordinatorLayout
:
<ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Your main content here -->
</ConstarintLayout>
<CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="MAX SIZE OF BOTTOM SHEET">
<YourBottomSheetLayout>
app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</CoordinatorLayout>
</ConstarintLayout>
您可以使用 BottomSheetBehavior
中的 setMaxHeight 方法(此方法应在 show()
方法之前调用)
bottomSheetDialog.behavior.maxHeight = 1000 // set max height when expanded in PIXEL
bottomSheetDialog.behavior.peekHeight = 400 // set default height when collapsed in PIXEL