I would like to display a bottom sheet dialog less wide than the screen width.
For instance, the Share option from Google Play Music on a Nexus 9.
Do you know how to achieve this ?
For now I just succed to reduce the width of the sheet content but the background is still at the screen width and display a white background.
Some code:
build.gradle
compile 'com.android.support:design:23.3.0'
MainActivity
@Override protected void onCreate(Bundle savedInstanceState) { ... mBottomSheetDialog = new BottomSheetDialog(this); mBottomSheetDialog.setContentView(R.layout.sheet_test); mBottomSheetDialog.setOnDismissListener(new DialogInterface.OnDismissListener() { @Override public void onDismiss(DialogInterface dialog) { mBottomSheetDialog = null; } }); mBottomSheetDialog.show(); }
sheet_test
<?xml version="1.0" encoding="utf-8"?> <android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="100dp" android:layout_height="match_parent" android:orientation="vertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <TextView style="@style/TextAppearance.AppCompat.Body1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="16dp" android:text="Some Text" android:textColor="@color/colorPrimary" /> <View android:layout_width="match_parent" android:layout_height="1dp" android:background="#ddd" /> <TextView style="@style/TextAppearance.AppCompat.Body1" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_margin="16dp" android:text="Some Text" /> <View android:layout_width="match_parent" android:layout_height="1dp" android:background="#ddd" /> </LinearLayout> </android.support.v4.widget.NestedScrollView>
Using the Interface - onSlide which as a parameter slideOffSet of type float , can be used to dim the background. The new offset of this bottom sheet within [-1,1] range. Offset increases as this bottom sheet is moving upward.
This worked for me when using BottomSheetDialogFragment
:
public class CustomDialogFragment extends BottomSheetDialogFragment { @Override public void onCreate(@Nullable Bundle savedInstanceState) { super.onCreate(savedInstanceState); setStyle(BottomSheetDialogFragment.STYLE_NORMAL, R.style.CustomBottomSheetDialogTheme); } ... }
Also add this to your styles.xml
<style name="CustomBottomSheetDialogTheme" parent="Theme.Design.Light.BottomSheetDialog"> <item name="bottomSheetStyle">@style/CustomBottomSheetStyle</item> </style> <style name="CustomBottomSheetStyle" parent="Widget.Design.BottomSheet.Modal"> <item name="android:background">@android:color/transparent</item> </style>
Option 2:
override fun getTheme() = R.style.CustomBottomSheetDialogTheme
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With