用键盘上方的EditText显示整个底部工作表

Adv*_*Dog 14 android android-layout android-softkeyboard bottom-sheet

我正在实现一个UI,在该UI的底部将在键盘上方显示一个EditText,供用户输入值。问题是视图被键盘部分重叠,覆盖了底部的底部。

这是底表,没有键盘。

底页

这是显示键盘的底部表。

在此处输入图片说明

确保显示整个底表的最佳方法是什么?

谢谢。

Dis*_*tra 23

只是从此问题中重新发布@jblejder,因为它对我有用,所以键盘会隐藏BottomSheetDialogFragment,以使其他人更容易找到:

我发现最方便的更改方式是创建样式:

<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">adjustResize</item>
</style>
Run Code Online (Sandbox Code Playgroud)

并在BottomSheetDialogFragment的onCreate方法中进行设置:

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setStyle(DialogFragment.STYLE_NORMAL, R.style.DialogStyle)
}
Run Code Online (Sandbox Code Playgroud)

这是我的设备上的样子:

在此处输入图片说明

  • 对我不起作用。在键盘出现在 EditText 上方之前,所以 EditText 被抬起并允许输入,但不能按下下方的 Button。在我应用您的解决方案后,没有任何改变。 (5认同)
  • 只需在 onCreateDialog() 中添加以下行以及 OnCreateView() 中的上述样式即可。`覆盖乐趣 onCreateDialog(savedInstanceState: Bundle?): Dialog { val BottomSheetDialog = super.onCreateDialog(savedInstanceState) if(bottomSheetDialog is BottomSheetDialog){ BottomSheetDialog.behavior.skipCollapsed = true BottomSheetDialog.behavior.state = BottomSheetBehavior.STATE_EXPANDED } return BottomSheetDialog }` (5认同)
  • 当底部工作表片段布局的根是 ScrollView 时有效 (2认同)
  • 奇迹般有效。对于动态底表,只需在声明时设置其样式即可。BottomSheetDialog bd =新的BottomSheetDialog(this,R.style.DialogStyle); (2认同)

小智 9

这是处理 BottomSheet 对话框的最简单、最好的方法:

private fun enterMobileNumberPopUp() {                                         
val dialog = BottomSheetDialog(this,R.style.DialogStyle)
val view = layoutInflater.inflate(R.layout.layout_otp, null)
dialog.setContentView(view)
dialog.behavior.state = BottomSheetBehavior.STATE_EXPANDED
dialog.show()}
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述

参考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">adjustResize</item>
</style>
Run Code Online (Sandbox Code Playgroud)


Deb*_*eep 8

这可能是一个多余的答案。虽然只是指出问题。如果您正在使用BottomSheetDialogFragment,唯一的方法是将属性android:windowIsFloating启用为true。这将使整个窗口位于任何试图占据其后面空间的顶部。

<style name="BottomSheetDialogThemeNoFloating" parent="Theme.Design.Light.BottomSheetDialog">
        <item name="android:windowIsFloating">false</item>
        <item name="android:windowSoftInputMode">adjustResize|stateVisible</item>
</style>
Run Code Online (Sandbox Code Playgroud)

然后在您onCreate()的对话框中,设置此样式。

override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // set the window no floating style
        setStyle(DialogFragment.STYLE_NORMAL, R.style.AppRoundedBottomSheetDialogThemeNoFloating)
}
Run Code Online (Sandbox Code Playgroud)

这对于那些经常使用底页并且可能想要处理EditText和软键盘相互重叠的人来说很方便。

注意:KeyboardUtilmikepenz的类存在一个问题,即在某些手机上,尽管为提供的整个内容视图提供了底部填充,但带有输入字段的内容视图会自动推送到键盘上方。

  • 您说“将其设置为`true`”,但写为`&lt;item name="android:windowIsFloating"&gt;false&lt;/item&gt;`。哪一个? (4认同)
  • 当使用“BottomSheetDialogFragment”时,这对我有用 (2认同)

ADM*_*ADM 7

ABottomSheetDialog对此会有帮助。它将打开软键盘,重点是编辑文本。但用户仍然可以关闭软键盘,对话框将重置为底部。再次聚焦将使对话框出现在软键盘的顶部。

 public void showDialog()  {
    final BottomSheetDialog dialog=new BottomSheetDialog(this);
    dialog.setContentView(R.layout.item_dialog);
    dialog.getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_VISIBLE);
    dialog.show();
}
Run Code Online (Sandbox Code Playgroud)

您可以使 BottomSheetDialog 在键盘上展开。但为此,您需要在 SoftKeyboard Open 之后调用它。展开代码是 .

 BottomSheetDialog d = (BottomSheetDialog) dialog;
            FrameLayout bottomSheet = (FrameLayout) d.findViewById(android.support.design.R.id.design_bottom_sheet);
            BottomSheetBehavior.from(bottomSheet).setState(BottomSheetBehavior.STATE_EXPANDED);
Run Code Online (Sandbox Code Playgroud)

我已经测试过DialogInterface.OnShowListener()但它不起作用。经测试,延迟1秒。但拖延并不是解决问题的办法。您需要弄清楚应该展开对话框的操作。

 final BottomSheetDialog dialog=new BottomSheetDialog(this);
    dialog.setContentView(R.layout.item_dialog);
    dialog.getWindow().setSoftInputMode(
            WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE|
                    WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_VISIBLE);
    new Handler().postDelayed(new Runnable() {
        @Override
        public void run() {
            FrameLayout bottomSheet = (FrameLayout) dialog.findViewById(android.support.design.R.id.design_bottom_sheet);
            BottomSheetBehavior.from(bottomSheet).setState(BottomSheetBehavior.STATE_EXPANDED);
        }
    },2000);
    dialog.show();
Run Code Online (Sandbox Code Playgroud)

  • 我试图显示整个“BottomSheetDialog”,这样我就可以将内容放在“EditText”下方,并且仍然可见。 (2认同)

xdb*_*bas 6

一些答案似乎比其他答案更好,但在使用新的材料设计组件而不是旧的支持库时需要修改,同时也使用 kotlin

希望这会帮助某人。

BottomSheetDialog(this, R.style.DialogStyle).apply {
    setContentView(layoutInflater.inflate(R.layout.bottom_sheet, null))
    window?.setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_VISIBLE)
    findViewById<EditText>(R.id.time_et)?.requestFocus()

    show()
}
Run Code Online (Sandbox Code Playgroud)

布局/bottom_sheet.xml

<?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:background="#ffffff"
        android:padding="16dp">

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


        <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

            <View
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1" />

            <LinearLayout
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_weight="5"
                    android:orientation="vertical">

                <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Time"
                        android:textColor="#000000"
                        android:textSize="24sp"
                        android:textStyle="bold" />

                <LinearLayout
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="8dp"
                        android:orientation="horizontal">

                    <EditText
                            android:id="@+id/time_et"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:inputType="numberSigned"
                            android:minWidth="50dp"
                            android:text="15" />

                    <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_marginLeft="8dp"
                            android:text="min" />

                </LinearLayout>


            </LinearLayout>

        </LinearLayout>


        <Button
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="16dp"
                android:background="#000"
                android:text="Save"
                android:textColor="#fff" />

    </LinearLayout>

</ScrollView>
Run Code Online (Sandbox Code Playgroud)

styes.xml(拆分为 v-21 以使用 statusBarColor)

    <style name="DialogStyle" parent="Theme.MaterialComponents.Light.BottomSheetDialog">
        <item name="android:windowIsFloating">false</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
        <item name="android:windowSoftInputMode">adjustResize</item>
    </style>
Run Code Online (Sandbox Code Playgroud)

  • 这是唯一对我有用的 DialogStyle 我使用 BottomSheetDialogFragment (2认同)

Vin*_*man 6

针对使用 Material Components 主题的用户的更新答案,以及改进的答案,以消除向每个对话框的onCreate().

在主 AppTheme 样式中,您可以添加属性bottomSheetDialogTheme以将该样式应用于所有BottomSheetDialogFragments:

 <style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
    <item name="colorPrimary">@color/primary</item>
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <item name="colorAccent">@color/accent</item>
    <item name="bottomSheetDialogTheme">@style/BottomSheetDialogStyle</item>
  </style>
Run Code Online (Sandbox Code Playgroud)

因此,有了上述内容,无需向 BottomSheetDialogFragment 代码添加任何内容。

然后,正如前面的答案,您的对话框样式,注意还要将样式与相同的材质组件库相匹配(否则您会得到一些看起来很奇怪的按钮、编辑文本等):

 <style name="BottomSheetDialogStyle" parent="Theme.MaterialComponents.Light.BottomSheetDialog">
    <item name="android:windowIsFloating">false</item>
    <item name="android:windowSoftInputMode">adjustResize</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
    <item name="colorPrimary">@color/primary</item>
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <item name="colorAccent">@color/accent</item>
  </style>
Run Code Online (Sandbox Code Playgroud)

请注意,我将我的应用程序主题颜色添加回此处;由于您无法在 Android 样式中拥有多重继承,因此您可能希望在此处定义这些颜色,以便任何按钮和重音符号与应用程序的其余部分保持一致。


小智 6

        bottomSheetDialog.getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE);
Run Code Online (Sandbox Code Playgroud)

它肯定会起作用。


小智 6

如果您使用底部工作表片段覆盖 getTheme()。setStyle 对我不起作用。将整个布局包裹在 NestedScrollView 中

主题.xml

<style name="BottomSheetDialogStyle" parent="Theme.Design.BottomSheetDialog">
        <item name="android:windowBackground">@null</item>
        <item name="android:windowIsFloating">false</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
        <item name="bottomSheetStyle">@style/bottomSheetBackground</item>
        <item name="android:windowSoftInputMode">adjustResize|stateVisible</item>
    </style>
Run Code Online (Sandbox Code Playgroud)

底片片段

@Override
public int getTheme() {
    return R.style.BottomSheetDialogStyle;
}
Run Code Online (Sandbox Code Playgroud)


Nor*_*ght 5

dialog = new BottomSheetDialog(getContext(), R.style.BottomSheetDialog);  
dialog.setOnShowListener(new DialogInterface.OnShowListener() {
@Override
public void onShow(DialogInterface dialog) {
            new Handler().postDelayed(new Runnable() {
                @Override
                public void run() {
                    BottomSheetDialog d = (BottomSheetDialog) dialog;
                    FrameLayout bottomSheet = d.findViewById(R.id.design_bottom_sheet);
                    BottomSheetBehavior bottomSheetBehavior = BottomSheetBehavior.from(bottomSheet);
                    bottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
                }
            },0);
        }
    });
Run Code Online (Sandbox Code Playgroud)

这段代码在Fragment的onCreateView方法上运行良好(感谢ADM)


小智 5

只需以编程方式编写以下内容

override fun setupDialog(dialog: Dialog, style: Int) {
        super.setupDialog(dialog, style)
        dialog.window?.setSoftInputMode(             WindowManager.LayoutParams.SOFT_INPUT_STATE_ALWAYS_VISIBLE or 
      WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE
      );
      }
Run Code Online (Sandbox Code Playgroud)