How can I dim the background when Bottomsheet is displayed, without using Dialog?

Question

I know BottomSheetDialog does so already, but I need to use the regular BottomSheet and behavior generated from BottomSheetBehavior.from(). This BottomSheet doesn't dim the background and also touch outside would not close it. Is there a way to dim the background when BottomSheet is displayed? and maybe dismiss when touch outside. Basically the behavior just like BottomSheetDialog but I must use BottomSheet BottomSheetBehavior directly.

Answer 1

You can use this code 1. MainActivity.xml

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/main_content" android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true">  <ScrollView     android:layout_width="match_parent"     android:layout_height="match_parent"     app:layout_behavior="@string/appbar_scrolling_view_behavior">      <LinearLayout         android:layout_width="match_parent"         android:layout_height="match_parent"         android:orientation="vertical"         android:paddingTop="24dp">          <Button             android:id="@+id/button_1"             android:layout_width="match_parent"             android:layout_height="wrap_content"             android:text="Button 1"             android:padding="16dp"             android:layout_margin="8dp"             android:textColor="@android:color/white"             android:background="@android:color/holo_green_dark"/>      </LinearLayout>  </ScrollView>  <View     android:visibility="gone"     android:id="@+id/bg"     android:background="#99000000"     android:layout_width="match_parent"     android:layout_height="match_parent"/>  <android.support.v4.widget.NestedScrollView     android:id="@+id/bottom_sheet"     android:layout_width="match_parent"     android:layout_height="350dp"     android:clipToPadding="true"     android:background="@android:color/holo_orange_light"     app:layout_behavior="android.support.design.widget.BottomSheetBehavior"     >      <TextView         android:layout_width="match_parent"         android:layout_height="match_parent"         android:text="aefwea"         android:padding="16dp"         android:textSize="16sp"/>  </android.support.v4.widget.NestedScrollView>   </android.support.design.widget.CoordinatorLayout> 

2. MAinActivity.java

   public class MainActivity extends AppCompatActivity implements View.OnClickListener {  private static final String TAG = "MainActivity"; private BottomSheetBehavior mBottomSheetBehavior; View bottomSheet; View mViewBg;  @Override protected void onCreate(Bundle savedInstanceState) {     super.onCreate(savedInstanceState);     setContentView(R.layout.activity_main);     bottomSheet = findViewById(R.id.bottom_sheet);     mViewBg = findViewById(R.id.mViewBg);     Button button1 = (Button) findViewById(R.id.button_1);     button1.setOnClickListener(this);     mViewBg.setOnClickListener(this);     mBottomSheetBehavior = BottomSheetBehavior.from(bottomSheet);     mBottomSheetBehavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {         @Override         public void onStateChanged(@NonNull View bottomSheet, int newState) {             if (newState == BottomSheetBehavior.STATE_COLLAPSED)                 mViewBg.setVisibility(View.GONE);         }          @Override         public void onSlide(@NonNull View bottomSheet, float slideOffset) {             Log.d(TAG, "onSlide: slideOffset" + slideOffset + "");            mViewBg.setVisibility(View.VISIBLE);             mViewBg.setAlpha(slideOffset);         }     });  }   @Override public void onClick(View v) {     switch (v.getId()) {         case R.id.button_1: {             mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);             break;         }         case R.id.bg: {             mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);             break;         }     } }   @Override public boolean dispatchTouchEvent(MotionEvent event) {     if (event.getAction() == MotionEvent.ACTION_DOWN) {         if (mBottomSheetBehavior.getState() == BottomSheetBehavior.STATE_EXPANDED) {             Rect outRect = new Rect();             bottomSheet.getGlobalVisibleRect(outRect);             if (!outRect.contains((int) event.getRawX(), (int) event.getRawY())) {                 mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);                 return true;             }          }     }     return super.dispatchTouchEvent(event); }  }