Search code examples
androidkotlinbottomsheetdialogfragment

How do I disable dimming of my app when showing BottomSheetDIalogFragment?


I'm currently developing an Android app in Kotlin in which I use a BottomSheetDialog Fragment. Whenever the dialog pops up, the rest of the screen is dimmed. Can I somehow disable this? I don't want to click the screen behind the fragment, I just want it to show up undimmed. Thanks in advance:

XMl of the Fragment:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/dark_green"
    >


    <TextView
        android:id="@+id/Title"
        android:layout_width="304dp"
        android:layout_height="50dp"
        android:layout_marginStart="50dp"
        android:layout_marginTop="20dp"
        android:layout_marginEnd="50dp"
        android:layout_marginBottom="20dp"
        android:lineSpacingExtra="8sp"
        android:textAlignment="center"
        android:textColor="#CCDEEE"
        android:textSize="24sp"
        android:textStyle="bold"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.571"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0" />

    <TextView
        android:id="@+id/Snippet"
        android:layout_width="304dp"
        android:layout_height="50dp"
        android:layout_marginStart="50dp"
        android:layout_marginTop="90dp"
        android:layout_marginEnd="50dp"
        android:layout_marginBottom="20dp"
        android:lineSpacingExtra="8sp"
        android:textAlignment="center"
        android:textColor="#CCDEEE"
        android:textSize="24sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.571"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0" />

    <TextView
        android:id="@+id/Position"
        android:layout_width="304dp"
        android:layout_height="70dp"
        android:layout_marginStart="50dp"
        android:layout_marginTop="160dp"
        android:layout_marginEnd="50dp"
        android:layout_marginBottom="60dp"
        android:lineSpacingExtra="8sp"
        android:textAlignment="center"
        android:textColor="#CCDEEE"
        android:textSize="24sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.571"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.0" />

</androidx.constraintlayout.widget.ConstraintLayout>

Here is a picture of the app so you can see what I mean:

https://i.sstatic.net/GNdwy.jpg


Solution

  • I suppose you are using Android Jetpack's Navigation Component, in case you aren't, maybe you should consider using it. You can take a look at this excellent video by Chet Haase of the Android Developers Team where it is explained.

    Now, going to the specifics of your question, if you followed the steps in the video, you can use any of the two options that I indicate below in the code:

    package com.example.myapp
    
    import ...
    
    class MyBottomSheetDialog : BottomSheetDialogFragment() {
    
        override fun onCreateView(
            inflater: LayoutInflater,
            container: ViewGroup?,
            savedInstanceState: Bundle?
        ): View {
    
            //Option 1:
            dialog?.window?.setDimAmount(0F)
            
            //Option 2:
            dialog?.window?.clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND)
    
            return inflater.inflate(R.layout.my_dialog, container, false)
        }
    }