BottomSheetDialog with transparent background

Question

I would like to display a dialog of the bottom sheet that was less than the width of the screen.

For example, the "Share" option on Google Play Music on Nexus 9.

Do you know how to achieve this?

Now I just achieved a reduction in the width of the contents of the sheet, but the background is still at the width of the screen and displays a white background.

Some codes:

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> 

Answer 1

So, I figured out 2 solutions.

Best:

Create an activity with a transparent background for the bottom sheet only. Implement your own layout with coordinate layout and bottom sheet. Set the field you want. Install the content you want.

Not yet verified.

Lazy

Extends BottomSheetDialogFragment to onActivityCreated add:

  Resources resources = getResources(); // Set margin for Landscape Mode. Maybe a more elegant solution will be to implements our own bottom sheet with our own margins. if (resources.getConfiguration().orientation == Configuration.ORIENTATION_LANDSCAPE) { assert getView() != null; View parent = (View) getView().getParent(); CoordinatorLayout.LayoutParams layoutParams = (CoordinatorLayout.LayoutParams) parent.getLayoutParams(); layoutParams.setMargins( resources.getDimensionPixelSize(R.dimen.bottom_sheet_margin_left), // 64dp 0, resources.getDimensionPixelSize(R.dimen.bottom_sheet_margin_right), // 64dp 0 ); parent.setLayoutParams(layoutParams); } 

Answer 2

This worked for me when using the 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> 

Answer 3

This is the simplest solution for a given transparent background. BottomSheetDialogFragment

((View) contentView.getParent ()). setBackgroundColor (getResources (). getColor (android.R.color.transparent));

 public class ShareOneTouchAlertNewBottom extends BottomSheetDialogFragment { @Override public void setupDialog(Dialog dialog, int style) { super.setupDialog(dialog, style); View contentView = View.inflate(getContext(), R.layout.fragment_bottom_sheet, null); dialog.setContentView(contentView); CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) ((View) contentView.getParent()) .getLayoutParams(); CoordinatorLayout.Behavior behavior = params.getBehavior(); ((View) contentView.getParent()).setBackgroundColor(getResources().getColor(android.R.color.transparent)); } } 

Answer 4

 BottomSheetDialog bottomSheetDialog =new BottomSheetDialog(this,R.style.SheetDialog); 

XML style

 <style name="SheetDialog" parent="Theme.Design.Light.BottomSheetDialog"> <!--<item name="android:windowCloseOnTouchOutside">false</item>--> <item name="android:windowIsTranslucent">true</item> <item name="android:windowContentOverlay">@null</item> <item name="android:colorBackground"> @android:color/transparent</item> <item name="android:backgroundDimEnabled">true</item> <item name="android:backgroundDimAmount">0.3</item> <item name="android:windowFrame">@null</item> <item name="android:windowIsFloating">true</item> </style> 

Answer 5

Sorry, got late, here is what you are looking for upvote if you have done it successfully

  @Override public void onActivityCreated(@Nullable Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); ((View) getView().getParent()).setBackgroundColor(Color.TRANSPARENT); } 

Add this line - a fragment of the dialogue of the bottom sheet.

Answer 6

A bit of a hack, but it works to make the background transparent. Obviously, you can replace “transparent” with whatever color you want.

 mBottomSheetDialog.getWindow().findViewById(R.id.design_bottom_sheet).setBackgroundResource(android.R.color.transparent); 

Answer 7

This is your answer: D

 View contentView=LayoutInflater.from(getContext()).inflate(R.layout.bs_add_event,null); mBottomSheetDialog.setContentView(contentView); CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) ((View) contentView.getParent()).getLayoutParams(); params.setMargins(50,50,50,50); // set margin as your wish. 

and also change android:layout_width="100dp" in nestedScroolView to android:layout_width="match_parent"

Answer 8

A late answer, but I ran into this problem myself and found a better solution than any of the proposed ones.

You can wrap your sheet layout with another layout with a transparent background and add a field to it (16dp here)

 <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/transparent" > <android.support.v4.widget.NestedScrollView android:layout_width="100dp" android:layout_height="match_parent" android:orientation="vertical" android:layout_margin="16dp"> .... 

Then add a transparent background to your sheet, as in Gnzlt's answer :

 <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> 

And voila, no other business is needed.

Answer 9

I had the same problem, nothing helped. Used this code to solve the problem:

  override fun onActivityCreated(savedInstanceState: Bundle?) { super.onActivityCreated(savedInstanceState) val bottomSheet = (view!!.parent as View) bottomSheet.backgroundTintMode = PorterDuff.Mode.CLEAR bottomSheet.backgroundTintList = ColorStateList.valueOf(Color.TRANSPARENT) bottomSheet.setBackgroundColor(Color.TRANSPARENT) } 

PS com.google.android.material: material: 1.1.0-alpha09

Answer 10

The following function implementation worked in the implementation of the BottomSheetDialogFragment :

 class MyTopicBottomSheet : BottomSheetDialogFragment() { override fun setupDialog(dialog: Dialog, style: Int) { super.setupDialog(dialog, style) dialog.window?.setDimAmount(0.0f) } ... rest of your class }