【问题标题】:CoordinatorLayout adds extra space to BottomSheet in fullscreen DialogCoordinatorLayout 在全屏对话框中为 BottomSheet 添加额外空间
【发布时间】:2019-09-06 09:14:53
【问题描述】:

我正在开发一个针对 API 22 的应用程序。

我正在尝试在视图底部添加BottomSheet,以全屏显示AlertDialog

不幸的是,CoordinatorLayout 似乎在视图底部添加了额外的空间。

但是,当此布局设置为contentViewActivity 时,不会添加此额外空间

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

我无法理解为什么此布局正确显示为活动内容视图,而不是全屏对话框。

您可以在下面找到根据 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()
        }
    }
}

这是没有发生问题的简单无所事事的活动

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)。

我知道它可以通过其他方式实现,但在我看来这是一个错误。

有人知道解决方案吗?

【问题讨论】:

  • 请不要在站外链接相关代码。您需要在问题本身中包含minimal reproducible example
  • 好的,移除了场外部分。
  • 笼统地说这只是一个不好的建议。我不知道他们为什么会这么说。直接使用Dialog 完全没问题,尤其是当您不需要或不想要框架子类所具有的任何固有内部结构时。 AlertDialog 专门用于您可能称之为“标准”对话框的内容;即带有标题、简短消息、是/否/取消按钮等的那些。您尝试做的事情不适合那种风格,所以使用AlertDialog 真的没有意义。
  • 另外,无论如何,我很确定这是你的全部问题。有一个支持库类,基本上可以完成您正在做的事情 - 带有底部工作表的全屏对话框 - 它直接使用 Dialog,任何地方都没有间隙。
  • 你说得对。切换到对话框,一切都如预期的那样。感谢您的帮助。

标签: android android-alertdialog android-coordinatorlayout bottom-sheet


【解决方案1】:

正如Mike M. 在这个问题的 cmets 中指出的那样,我不得不避免使用 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()
}

布局现在按预期运行。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-02-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多