Show entire bottom sheet with EditText above Keyboard

Question

I\'m implementing a UI where a bottom sheet will appear above the keyboard with an EditText for the user to enter a value. The problem is the View is being partially overlap

Answer 1

For this, I found an AlertDialog worked best. While it doesn't sit flush against the bottom or side of the screen, it still looks good enough.

First, create the AlertDialog with your view.

val view = LayoutInflater.from(context).inflate(R.layout.alert, null)

dialog = AlertDialog.Builder(context)
             .setView(view)
             .create()

Next, set the gravity.

    dialog.window.attributes.gravity = Gravity.BOTTOM

And finally, show it.

dialog.show()

You can also bind the keyboard to stay with the dialog, by using an onDismissListener.

After showing the AlertDialog, I force up the keyboard.

Call this method, passing in your EditText.

fun showKeyboard(view: View?) {
        if (view == null) return;

        val imm = (InputMethodManager) view.getContext().getSystemService(Context.INPUT_METHOD_SERVICE);
        imm.toggleSoftInput(InputMethodManager.SHOW_FORCED, InputMethodManager.HIDE_IMPLICIT_ONLY);
    }

And for dismissing within the onDismissListener.

private fun hideKeyboard() {
        val imm = context.getSystemService(Context.INPUT_METHOD_SERVICE) as InputMethodManager
        imm.toggleSoftInput(InputMethodManager.HIDE_IMPLICIT_ONLY, 0)
    }