How to prevent automatic resizing of MaterialAlertDialogBuilder height when the keyboard is open?

237 views Asked by At

I have built a custom dialog with MaterialAlertDialogBuilder. The dialog has 2 TextInputLayouts. The problem is when I try to write something in the TextInputEditText and when the keyboard is visible, the MaterialAlertDialogBuilder shrinks in height.

In XML code:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
    android:padding="16dp"
    tools:viewBindingIgnore="true">

    <com.google.android.material.textfield.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="দোয়া"
        app:endIconMode="clear_text"
        app:shapeAppearance="@style/ShapeAppearance.App.SmallComponent"
        tools:viewBindingIgnore="true">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/doarName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content" />

    </com.google.android.material.textfield.TextInputLayout>

    <com.google.android.material.textfield.TextInputLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="11dp"
        android:hint="দৈনিক কতবার পাঠ করবেন?"
        app:endIconMode="clear_text"
        app:shapeAppearance="@style/ShapeAppearance.App.SmallComponent"
        tools:viewBindingIgnore="true">

        <com.google.android.material.textfield.TextInputEditText
            android:id="@+id/number"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:inputType="number" />

    </com.google.android.material.textfield.TextInputLayout>

</LinearLayout>


In Kotlin:

MaterialAlertDialogBuilder(this@TosbiActivity).setView(view).setTitle("দোয়া যুক্ত করুন")
                .setPositiveButton("Apply") { dialog, _ ->

                    /*
                    ......
                     */

                    dialog.dismiss()
                }.setNegativeButton("Cancel") { dialog, _ ->
                    dialog.dismiss()
                }.show()

The output of ths code:

(when the keyboard is hidden)

(when the keyboard is hidden).

(when the keyboard is visible)

(When the keyboard is visible)

What am I tried?

I checked by adding the android:windowSoftInputMode="adjustResize"/> and android:windowSoftInputMode="adjustPan" codes in activity tag of the manifest, but it doesn't work. And also I searched or asked about this on the internet + ChatGPT AI but got no correct answer.

4

There are 4 answers

0
Abdullah On BEST ANSWER

In the mentioned problem the dialog is created using MaterialAlertDialogBuilder. But the problem is that when the dialog is shown on a small screen, clicking on the input field is resizing the dialog box. Below is a simple way to solve this problem.

The problem can be solved in two ways.

Alert Dialog Builder Code:

 val dialog = MaterialAlertDialogBuilder(this)
            .setView(View.inflate(this,R.layout.dialog, null))
            .setTitle("দোয়া যুক্ত করুন")
            .setPositiveButton("Apply") { d, _ ->
                d.dismiss()
            }.setNegativeButton("Cancel") { d, _ ->
                d.dismiss()
            }.create()

The first one:

dialog.window?.addFlags(WindowManager.LayoutParams.FLAG_LAYOUT_IN_SCREEN)

The second:

dialog.window?.addFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS)

Adding either WindowManager.LayoutParams.FLAG_LAYOUT_IN_SCREEN or WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS to the constant will hopefully work.

Note: window.addFlage must be set before showing the dialog

The code snippet:

  val dialog = MaterialAlertDialogBuilder(this)
                    .setView(View.inflate(this,R.layout.dialog, null))
                    .setTitle("দোয়া যুক্ত করুন")
                    .setPositiveButton("Apply") { d, _ ->
                        d.dismiss()
                    }.setNegativeButton("Cancel") { d, _ ->
                        d.dismiss()
                    }.create()

        
   dialog.window?.addFlags(WindowManager.LayoutParams.FLAG_LAYOUT_IN_SCREEN)
   dialog.show()
0
AR Sharif Uddin JUMMAN On

After doing a lot of research, I figured out the cause of the problem.

The problem was due to the screen size of the device. I have checked on a device with a bigger screen size than my device, the problem does not occur.

To avoid this problem: AlertDialog.Builder can be used instead of MaterialAlertDialogBuilder or you can solve the problem by adding this code to your MaterialAlertDialogBuilder.

.window?.setFlags(
                    WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS,
                    WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS
                )

The complete code will look like this:

val view = layoutInflater.inflate(R.layout.add_doa, null)

            MaterialAlertDialogBuilder(this@TosbiActivity).setView(view).setTitle("দোয়া যুক্ত করুন")
                .setPositiveButton("Apply") { dialog, _ ->

                    /*
                    ......
                     */

                    dialog.dismiss()
                }.setNegativeButton("Cancel") { dialog, _ ->
                    dialog.dismiss()
                }.show().window?.setFlags(
                    WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS,
                    WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS
                )
1
Sarowar Hosen On

The problem is caused by the screen size of your device. If you test the app on a device with a larger screen size, the issue won't occur.

My recommendation is: Use AlertDialog.Builder instead of MaterialAlertDialogBuilder.

also you can create an issue on 'material-components-android' repo in github, so they can fix it . Until they fix it use AlertDialog.Builder

1
C.F.G On

I haven't tested this solution on all screen sizes but I wrap whole layout inside a ScrollView:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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="wrap_content"
    android:orientation="vertical"
    android:scrollbars="none">

    <LinearLayout 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:orientation="vertical"
        android:padding="16dp"
        tools:viewBindingIgnore="true">

        <com.google.android.material.textfield.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="দোয়া"
            app:endIconMode="clear_text"
            app:shapeAppearance="@style/ShapeAppearance.App.SmallComponent"
            tools:viewBindingIgnore="true">

            <com.google.android.material.textfield.TextInputEditText
                android:id="@+id/doarName"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

        </com.google.android.material.textfield.TextInputLayout>

        <com.google.android.material.textfield.TextInputLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="11dp"
            android:hint="দৈনিক কতবার পাঠ করবেন?"
            app:endIconMode="clear_text"
            app:shapeAppearance="@style/ShapeAppearance.App.SmallComponent"
            tools:viewBindingIgnore="true">

            <com.google.android.material.textfield.TextInputEditText
                android:id="@+id/number"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:inputType="number" />

        </com.google.android.material.textfield.TextInputLayout>

    </LinearLayout>
</ScrollView>