显示带有EditText的完整底部表单,位于键盘上方。

99
我正在实现一个UI,其中底部工作表将出现在键盘上方,其中包含一个EditText供用户输入值。问题是该视图被键盘部分覆盖,覆盖了底部的底部表单。
这是Bottom Sheet而没有键盘。 Bottom Sheet 这是显示键盘的底部表格。 enter image description here 什么方法最好确保整个底部表单被显示?
谢谢。

在声明活动的清单文件中的活动内,使用“android:windowSoftInputMode =”stateHidden“”,可以防止键盘弹出,直到您触摸EditText。 - brahmy adigopula
我需要键盘显示出来,这样人们就可以输入他们的值。 - advice
2
试试这个:https://dev59.com/6Ok5XIcBkEYKwwoY9-t1#50948146 - Ivan Shafran
请参见 https://dev59.com/6Ok5XIcBkEYKwwoY9-t1。 - CoolMind
2
只需将此代码添加到您的BottomSheetDialogFragment中:"getDialog().getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE)" - Tarique Anowar
显示剩余2条评论
19个回答

2
这个技巧帮助了我。
在清单文件中加入以下内容。
android:windowSoftInputMode="adjustPan"

在你的活动中

        bottomSheetDialog.getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);
    bottomSheetDialog.getBehavior().setState(BottomSheetBehavior.STATE_EXPANDED);

2
Kotlin,+使用视图绑定,+通过使用被接受的答案的对话框样式。
val bottomSheet = BottomSheetDialog(this, R.style.BottomSheetDialogStyle)
val binding = [YourSheetBinding].inflate(LayoutInflater.from(YourActivity.this))
bottomSheet.setContentView(binding.root)
bottomSheet.behavior.state = BottomSheetBehavior.STATE_EXPANDED
bottomSheet.show()

2
这个有效。
 BottomSheetDialog dialog = new BottomSheetDialog(this, R.style.DialogStyle);
    View sheetView = getLayoutInflater().inflate(R.layout.dialog_remark, null);
    Objects.requireNonNull(dialog.getWindow())
            .setSoftInputMode(SOFT_INPUT_STATE_VISIBLE);
    dialog.setContentView(sheetView);
    dialog.setOnShowListener(new DialogInterface.OnShowListener() {
        @Override
        public void onShow(DialogInterface dialog) {
            BottomSheetDialog d = (BottomSheetDialog) dialog;
            View bottomSheetInternal = d.findViewById(com.google.android.material.R.id.design_bottom_sheet);
            BottomSheetBehavior.from(bottomSheetInternal).setState(BottomSheetBehavior.STATE_EXPANDED);
        }
    });
    dialog.show();

将以下样式添加到styles.xml中

 <style name="DialogStyle" parent="Theme.Design.Light.BottomSheetDialog">
    <item name="android:windowIsFloating">false</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
    <item name="android:windowSoftInputMode">adjustPan</item>
</style>

像这样添加您的布局:

 <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
android:id="@+id/scrollview"

    android:layout_height="match_parent">

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"

        android:layout_margin="8dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_margin="8dp"
                android:fontFamily="@font/montserratmedium"
                android:text="Add Remarks"
                android:textColor="@android:color/black"
                android:textSize="18sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:layout_marginTop="24dp"
                android:fontFamily="@font/montserratmedium"
                android:text="Branch"
                android:textColor="#8B8B8B"
                android:textSize="18sp" />


            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:layout_marginTop="8dp"
                android:fontFamily="@font/montserratmedium"
                android:text="BLR-CO-SINDHUBHAVAN-384"
                android:textColor="@android:color/black"
                android:textSize="18sp" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:layout_marginTop="24dp"
                android:fontFamily="@font/montserratmedium"
                android:text="Enter Remarks"
                android:textColor="#8B8B8B"
                android:textSize="18sp" />


            <EditText

                android:id="@+id/input_remark"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="10dp"
                android:layout_marginTop="8dp"
                android:background="@drawable/remark_inputbg"
                android:gravity="start"

                android:inputType="textMultiLine"
                android:lines="5" />

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <LinearLayout
                    android:id="@+id/action"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal"
                    android:weightSum="2">

                    <Button
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="8dp"
                        android:layout_weight="1"
                        android:background="@drawable/reset_bg"
                        android:padding="8dp"
                        android:text="CANCEL" />

                    <Button
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_margin="8dp"
                        android:layout_weight="1"
                        android:background="#4F4DBB"
                        android:padding="8dp"
                        android:text="CANCEL"
                        android:textColor="@android:color/white" />
                </LinearLayout>
            </RelativeLayout>


        </LinearLayout>

    </androidx.cardview.widget.CardView>

</ScrollView>

只有在AndroidManifest中设置android:windowSoftInputMode="stateHidden|adjustPan"才能解决我的问题。谢谢! - Chirag

1
 override fun onStart() {
    super.onStart()
    bottomSheetBehavior?.skipCollapsed = true
    bottomSheetBehavior?.state = BottomSheetBehavior.STATE_EXPANDED
}

将这个放在BottomSheet中,不需要设置样式,也不需要使用ScrollView。(如果我说错了或者漏掉了什么,请纠正我)

0

请参考https://dev59.com/KVcO5IYBdhLWcg3wkiVN#61813321

override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
    val dialog = super.onCreateDialog(savedInstanceState) as BottomSheetDialog
    dialog.behavior.state = BottomSheetBehavior.STATE_EXPANDED
    return dialog
}

但如果布局不够高,你可以使用 https://dev59.com/9VEG5IYBdhLWcg3wgf2Y#66287187 替代。它会打开几乎全屏的 BottomSheetDialog:

<style name="BottomSheetDialogTheme" parent="Theme.MaterialComponents.Light.BottomSheetDialog">
  <item name="android:windowIsFloating">false</item>
  <item name="android:windowSoftInputMode">adjustResize|stateVisible</item>
</style>

0

为此,我发现使用AlertDialog效果最佳。虽然它不会完全贴合屏幕底部或侧边,但仍然看起来足够好。

首先,使用您的视图创建AlertDialog

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

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

接下来,设置重力。

    dialog.window.attributes.gravity = Gravity.BOTTOM

最后,展示它。

dialog.show()

您还可以使用 onDismissListener 将键盘绑定到对话框上。

在显示 AlertDialog 后,我强制打开键盘。

调用此方法,并传入您的 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);
    }

并且在 onDismissListener 中进行解除。

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

0

我的回答可能对仍在寻找解决方案的人有用。如果键盘覆盖了BottomSheetDialogFragment中的edittext,则在setupDialog()方法中创建KeyboardUtil类的实例并传递您的rootview。

    @Override
    public void setupDialog(final Dialog dialog, int style) {
        super.setupDialog(dialog, style);
        View view = View.inflate(getActivity(), R.layout.reopen_dialog_layout, null);
        new KeyboardUtil(getActivity(), view);
}

创建一个新类

    public class KeyboardUtil {
        private View decorView;
        private View contentView;
        //a small helper to allow showing the editText focus
        ViewTreeObserver.OnGlobalLayoutListener onGlobalLayoutListener = new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
            public void onGlobalLayout() {
                Rect r = new Rect();
                //r will be populated with the coordinates of your view that area still visible.
                decorView.getWindowVisibleDisplayFrame(r);

                //get screen height and calculate the difference with the useable area from the r
                int height = decorView.getContext().getResources().getDisplayMetrics().heightPixels;
                int diff = height - r.bottom;

                //if it could be a keyboard add the padding to the view
                if (diff != 0) {
                    // if the use-able screen height differs from the total screen height we assume that it shows a keyboard now
                    //check if the padding is 0 (if yes set the padding for the keyboard)
                    if (contentView.getPaddingBottom() != diff) {
                        //set the padding of the contentView for the keyboard
                        contentView.setPadding(0, 0, 0, diff);
                    }
                } else {
                    //check if the padding is != 0 (if yes reset the padding)
                    if (contentView.getPaddingBottom() != 0) {
                        //reset the padding of the contentView
                        contentView.setPadding(0, 0, 0, 0);
                    }
                }
            }
        };

        public KeyboardUtil(Activity act, View contentView) {
            this.decorView = act.getWindow().getDecorView();
            this.contentView = contentView;

            //only required on newer android versions. it was working on API level 19
            if (Build.VERSION.SDK_INT >= 19) {
                decorView.getViewTreeObserver().addOnGlobalLayoutListener(onGlobalLayoutListener);
            }
        }

        /**
         * Helper to hide the keyboard
         *
         * @param act
         */
        public static void hideKeyboard(Activity act) {
            if (act != null && act.getCurrentFocus() != null) {
                InputMethodManager inputMethodManager = (InputMethodManager) act.getSystemService(Activity.INPUT_METHOD_SERVICE);
                inputMethodManager.hideSoftInputFromWindow(act.getCurrentFocus().getWindowToken(), 0);
            }
        }

        public void enable() {
            if (Build.VERSION.SDK_INT >= 19) {
                decorView.getViewTreeObserver().addOnGlobalLayoutListener(onGlobalLayoutListener);
            }
        }

        public void disable() {
            if (Build.VERSION.SDK_INT >= 19) {
                decorView.getViewTreeObserver().removeOnGlobalLayoutListener(onGlobalLayoutListener);
            }
        }
    }

0
如果你正在使用Compose,你可以在最底部的Composable上添加Modifier.imePadding()。然后键盘顶部将会对齐该元素。

-1

折腾 BottomSheetDialogFragment 真的不值得。所以我只是将其更改为简单的 DialogFragment,并将其重力设置为底部:

window.setGravity(Gravity.BOTTOM);

非常顺利地工作了。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接