带有底部粘性按钮的BottomSheetDialogFragment

Question

我在我的 BottomSheetDialogFragment 中遇到了一些显示按钮的问题。我希望它能够固定在底部工作表上，无论该工作表是展开还是折叠。

请参见下面的图片：

（我使用 Sketch 创建了这个图片）

有什么提示或技巧吗？

顺便说一下，如果您知道如何向 bottomsheetdialog 添加顶部边距，那就更好了；）

- Tanguy C

---

你好！ 很遗憾，我没有找到解决方案，屏幕也没有通过验证，所以我们找到了一个解决方法。 我认为你可以尝试使用MotionLayout来实现这样的事情。虽然它还处于alpha版本，但我已经玩过它了，它非常强大，而且很有趣。如果你有点好奇和冒险精神，不妨试试！我相信你可以接近这个目标。 - Tanguy C

嗨，感谢您提供MotionLayout的提示。看起来它真的很强大，我会尝试一下。 - PeterG

Answer 1

感谢 @Gnocalo 发布的帖子。我已经实现了它，请在我的 Github 上找到。

步骤：

• 找到父视图 BottomSheetDialogFragment
• 填充自定义视图并将其附加到父视图上
• 调整底部表格的边距以避免视图重叠

- Xianwei

Answer 2

我解决这个问题的方法如下：

1. 实现BottomSheetDialogFragment
2. 重写onCreateDialog方法
3. 获取bottomSheetDialog的引用并设置onShowListener
4. 从我的布局中删除按钮并将其添加到R.id.container中（当然，您也可以编程创建自己的按钮，我之所以这样做是为了更容易地格式化按钮视图）。这样，您的按钮将覆盖R.id.design.bottom.sheet，因为R.id.container是它的父级！

以下是示例代码：

    val bottomSheetDialog = super.onCreateDialog(savedInstanceState) as BottomSheetDialog
    bottomSheetDialog.setOnShowListener {
        val dialog = it as BottomSheetDialog

            dialog.findViewById<FrameLayout>(com.google.android.material.R.id.design_bottom_sheet) as FrameLayout
        val containerLayout: FrameLayout =
            dialog.findViewById<FrameLayout>(com.google.android.material.R.id.container) as FrameLayout
        val button = binding.submitButton
        val parent = button.parent as ViewGroup
        parent.removeView(button)
        containerLayout.addView(button, containerLayout.childCount)
    }
    return bottomSheetDialog

这样，您的底部工作表将正常响应触摸，并且按钮将保持在其父级上的位置。

如果您有任何疑问，请随时询问。

编辑

不要忘记为按钮定义布局参数/定位，以使其位于R.id.container底部。

- Gonçalo Gaspar

Answer 3

我正在寻找一种解决粘性底部按钮的方案，但也想回答您关于设置底部工作表边距的附加问题。

因此，您无法向您的底部工作表添加边距，它基本上是由底部工作表状态处理的。

您可以通过以下方式明确设置底部工作表的状态：

val bottomSheet = dialog!!.findViewById<View>(design_bottom_sheet) as FrameLayout
val behavior: BottomSheetBehavior<*> = BottomSheetBehavior.from<View>(bottomSheet)
behavior.state = BottomSheetBehavior.STATE_HALF_EXPANDED

- Pratik Bhandari

Answer 4

可能需要一些时间，但我遇到了同样的问题，所以决定写一篇文章：在底部表单对话框中添加 Android 粘性视图

- Dorian Pavetić

---

工作了，但是一开始理解起来太复杂了。 - Tehleel Mir

很高兴它能够工作。您能否解释一下哪些部分比较难理解，这样我就可以以更简单的方式进行更新？谢谢。 - Dorian Pavetić

Answer 5

要实现所提到的功能，您可以在RecyclerView上将constrainedHeight设置为true。此外，将RecyclerView的底部约束到按钮的顶部，并将按钮约束到末尾。请参考下面的代码。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <androidx.recyclerview.widget.RecyclerView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/recycler_view"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constrainedHeight="true"
        app:layout_constraintBottom_toTopOf="@id/button"/>

    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

- Antonio