Android 底部弹出式模态窗口(对话框)未完全打开

15

我试图在应用程序中的按钮点击事件中显示一个底部对话框。但是对话框只打开了部分。我希望在按钮点击时完全打开对话框。

我尝试了以下代码。

MainActivity.java

public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);

    View showModalBottomSheet = findViewById(R.id.as_modal);
    showModalBottomSheet.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            //Initializing a bottom sheet
            BottomSheetDialogFragment bottomSheetDialogFragment = new CustomBottomSheetDialogFragment();

            //show it
            bottomSheetDialogFragment.show(getSupportFragmentManager(), bottomSheetDialogFragment.getTag());
        }
    });
}
}

CustomBottomSheetDialogFragment.java

public class CustomBottomSheetDialogFragment extends BottomSheetDialogFragment {


@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
}

private BottomSheetBehavior.BottomSheetCallback mBottomSheetBehaviorCallback = new BottomSheetBehavior.BottomSheetCallback() {

    @Override
    public void onStateChanged(@NonNull View bottomSheet, int newState) {
        if (newState == BottomSheetBehavior.STATE_HIDDEN) {
            dismiss();
        }
    }

    @Override
    public void onSlide(@NonNull View bottomSheet, float slideOffset) {
    }
};

@Override
public void setupDialog(Dialog dialog, int style) {
    super.setupDialog(dialog, style);
    View contentView = View.inflate(getContext(), R.layout.dialog_modal, null);
    dialog.setContentView(contentView);
    CoordinatorLayout.LayoutParams layoutParams =
            (CoordinatorLayout.LayoutParams) ((View) contentView.getParent()).getLayoutParams();
    CoordinatorLayout.Behavior behavior = layoutParams.getBehavior();
    if (behavior != null && behavior instanceof BottomSheetBehavior) {
        ((BottomSheetBehavior) behavior).setBottomSheetCallback(mBottomSheetBehaviorCallback);
    }
}
}

activity_main.xml

  <?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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="match_parent">

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay" />

</android.support.design.widget.AppBarLayout>

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <Button
        android:id="@+id/as_modal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/activity_horizontal_margin"
        android:text="@string/modal" />

</android.support.v4.widget.NestedScrollView>

在这里你可以找到该项目的链接:

Github 项目链接

当前行为:

当前行为的截图

9个回答

10

在setUpDialog方法中的这些代码可以解决这个问题

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

我不确定为什么它会这样工作,但我认为将其指向STATE_COLLAPSED会更好。 - Zeek Aran
只需将其设置为所需值:app:behavior_peekHeight="180dp"。 - Alexei
1
这对我很有效,但是我不得不使用 R.id.design_bottom_sheet 代替 android.support.design.R.id.design_bottom_sheet - Mickäel A.

3
在你的CustomBottomSheetDialogFragment的onCreate方法中编写该方法。
getDialog().setOnShowListener(new DialogInterface.OnShowListener() {
        @Override
        public void onShow(DialogInterface dialog) {
            BottomSheetDialog d = (BottomSheetDialog) dialog;
            FrameLayout bottomSheet =  d.findViewById(R.id.design_bottom_sheet);
            CoordinatorLayout lyout = (CoordinatorLayout) bottomSheet.getParent();
            BottomSheetBehavior behavior = BottomSheetBehavior.from(bottomSheet);
            behavior.setPeekHeight(bottomSheet.getHeight());
            lyout.getParent().requestLayout();
        }
    });

1
BottomSheetDialogFragmentBottomSheetDialog在Android支持库版本23.2.0中存在一些问题。您可以在Android支持库,修订版23.2.1(2016年3月)部分中检查此doc。因此,解决方案是将com.android.support:design版本更新到23.2.0以上(23.2.1、23.3.0、23.4.0等任何新版本)。我已经在新版本中测试了你的代码,它正常工作。希望它有所帮助。

@ShubhamBansal 好的。请接受我的答案以帮助其他人。 :) - JohnWatsonDev
2
我们已经使用的是最新版本28.0.0。然而,这个问题仍在发生! - AndiGeeky

1
在onCreateView方法中添加类似以下内容的代码:
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    getDialog().setOnShowListener(new DialogInterface.OnShowListener() {
        @Override
        public void onShow(DialogInterface dialog) {
            BottomSheetDialog d = (BottomSheetDialog) dialog;
            View bottomSheetInternal = d.findViewById(android.support.design.R.id.design_bottom_sheet);
            BottomSheetBehavior.from(bottomSheetInternal).setState(BottomSheetBehavior.STATE_EXPANDED);
        }
    });
    return inflater.inflate(R.layout.your_bottomsheet_content_layout, container, false);
}

用于 AndroidX

com.google.android.material.R.id.design_bottom_sheet

替代

android.support.design.R.id.design_bottom_sheet

1
我已经按照以下步骤操作,这对于 BottomSheetDialog 对话框 很有帮助。
第一步:要创建一个 BottomSheetBehavior,需要使用默认情况下存在的对话框的 FrameLayout
FrameLayout bottomSheet = dialog.findViewById(android.support.design.R.id.design_bottom_sheet);

如果您正在使用AndroidX,请使用:

FrameLayout bottomSheet = dialog.findViewById(com.google.android.material.R.id.design_bottom_sheet);

步骤2:将底部表格行为设置为展开状态,并设置峰值高度

BottomSheetBehavior behavior = BottomSheetBehavior.from(bottomSheet);
behavior.setState(BottomSheetBehavior.STATE_EXPANDED);
behavior.setPeekHeight(screenHeight / 2);
behavior.setHideable(false);

第三步:禁止对话框在触摸外部时取消。
dialog.setCanceledOnTouchOutside(false);

注意:您可以使用DisplayMetrics动态计算屏幕高度。
DisplayMetrics screenMetrics = new DisplayMetrics();
            getWindowManager().getDefaultDisplay().getMetrics(screenMetrics);
            int screenHeight = screenMetrics.heightPixels;
            int screenWidth = screenMetrics.widthPixels;

0

我遇到了同样的问题。奇怪的原因是Toolbar。 如果你移除 Toolbar,那么底部菜单列表就会全屏显示。

我不知道这背后的原因。但是移除 Toolbar 后它就正常工作了。 你可以试一下。


我的猜测是这是屏幕高度的因素,因此当您删除工具栏时,会有更多可用空间。在我的情况下,仅在屏幕方向为水平时才会发生。 - Efi G

0

你应该为你的行为设置peekHeight


1
可能会需要一些答案的详细说明。 - YakovL
3
bottomSheetBehavior.setPeekHeight(size); - Felipe Oliveira

0

不要使用Fragment,使用BottomSheetDialog。 示例演示已上传至 https://github.com/bita147/BottomSheetDialog

对于模型对话框,只需设置

bottomshetDialod.setCanceledOnTouchOutside(false);

对我来说可行。


0

这段代码对我来说可行。

override fun onCreateView(
    inflater: LayoutInflater,
    container: ViewGroup?,
    savedInstanceState: Bundle?
): View? {

    dialog!!.setOnShowListener { dialog ->
        val d = dialog as BottomSheetDialog
        val bottomSheetInternal: FrameLayout? =
            d.findViewById(com.google.android.material.R.id.design_bottom_sheet)
        BottomSheetBehavior.from(bottomSheetInternal!!).state =
            BottomSheetBehavior.STATE_EXPANDED
    }
    val view = inflater.inflate(R.layout.bottom_sheet_modal, container, false)

    return view
}

我忘了说我目前使用 Kotlin 进行开发。 - David Latorre

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