CoordinatorLayout 在全屏对话框中向 BottomSheet 添加了额外的 space

Question

我正在开发一个针对 API 22.

的应用程序

我正在尝试在视图底部添加一个 BottomSheet，全屏显示 AlertDialog。

不幸的是，CoordinatorLayout 似乎在视图底部添加了额外的 space。

但是，当此布局设置为 Activity

的 contentView 时，不会添加此额外的 space

查看这些屏幕截图的不同之处：

我不明白为什么这个布局正确显示为 activity contentView，而不是在全屏对话框中。

您可以在下方找到产生这些结果的代码，该代码基于 Android Studio 向导中新创建的 Android 应用程序：

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
    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="match_parent"
    android:fitsSystemWindows="true">

    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/top_app_bar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:elevation="8dp"
            app:title="[Title]">
        </androidx.appcompat.widget.Toolbar>

    </com.google.android.material.appbar.AppBarLayout>

    <androidx.core.widget.NestedScrollView
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">

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

            <!-- [...] --> 

        </LinearLayout>
    </androidx.core.widget.NestedScrollView>

    <LinearLayout
        android:id="@+id/bottom_app_bar"
        android:layout_width="match_parent"
        android:layout_height="240dp"
        android:elevation="8dp"
        android:orientation="vertical"
        app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior"
        app:behavior_peekHeight="148dp">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="56dp"
            android:orientation="horizontal"
            android:padding="8dp">

            <TextView
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="2"
                android:text="BottomSheet Header" />

        </LinearLayout>

        <LinearLayout
            android:id="@+id/payment_buttons"
            android:layout_width="match_parent"
            android:layout_height="80dp"
            android:orientation="horizontal">

            <androidx.appcompat.widget.AppCompatButton
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:backgroundTint="@color/colorPrimary"
                android:text="TEST 1" />

            <androidx.appcompat.widget.AppCompatButton
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:backgroundTint="@color/colorPrimaryDark"
                android:text="TEST 2" />

            <androidx.appcompat.widget.AppCompatButton
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:backgroundTint="@color/colorAccent"
                android:text="TEST 3" />

            <androidx.appcompat.widget.AppCompatButton
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:backgroundTint="@android:color/holo_blue_bright"
                android:text="TEST 4" />

        </LinearLayout>
    </LinearLayout>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

这是构建和显示 AlertDialog 的 MainActivity:

package com.axample.bottomsheetondialog

import android.content.Intent
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import androidx.appcompat.app.AlertDialog

import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        setSupportActionBar(app_bar)

        bs_dialog.setOnClickListener {
            AlertDialog.Builder(this, R.style.AppTheme_FullscreenDialog)
                .setView(R.layout.view_with_bottomsheet)
                .create()
                .show()
        }
    }
}

这就是简单的无所事事Activity不会出现问题的地方

package fr.izypay.bottomsheetondialog

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity

import kotlinx.android.synthetic.main.view_with_bottomsheet.*

class BottomsheetActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.view_with_bottomsheet)
        setSupportActionBar(top_app_bar)

        top_app_bar.title = "Bottomsheet in an activity"
    }

}

最后，这是用于全屏的主题（参见 AppTheme.FullscreenDialog）

<resources>

    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
    </style>
    <style name="AppTheme.FullscreenDialog" parent="AppTheme">

        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>

        <item name="android:windowFullscreen">false</item>
        <item name="android:windowIsFloating">false</item>
    </style>

</resources>

我真的需要这种布局来实现可滚动列表（此处带有数字）和底部始终位于顶部的不断增长的工具栏（BottomSheet）。

我知道可以通过其他方式实现，但我觉得这是个错误。

有谁知道解决这个问题的方法吗？

Answer 1

正如 Mike M. 在这个问题的评论中所指出的，我不得不避免使用 AlertDialog.Builder，而是使用我们自己构建的 Dialog。

在 MainActivity 中，我不得不替换

AlertDialog.Builder(this, R.style.AppTheme_FullscreenDialog)
    .setView(R.layout.view_with_bottomsheet)
    .create()
    .show()

来自

Dialog(this, R.style.AppTheme_FullscreenDialog).also {
    it.setContentView(R.layout.view_with_bottomsheet)
    it.show()
}

并且布局现在按预期运行。

CoordinatorLayout 在全屏对话框中向 BottomSheet 添加了额外的 space

CoordinatorLayout adds extra space to BottomSheet in fullscreen Dialog

android

android-alertdialog

android-coordinatorlayout

bottom-sheet