在 Android Studio 3.0 中显示带有协调器布局的空白屏幕的布局预览

Question

这是布局设计代码，当我打开布局预览页面灰色 android 屏幕仅显示 (android...CoordinatorLayout) 并且屏幕上没有显示任何内容。我该如何解决这个问题，我想在布局预览中显示布局设计屏幕。

<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:fitsSystemWindows="true"
tools:context=".activity.AddDietActivity">

<android.support.design.widget.AppBarLayout
    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:gravity="center"
        app:popupTheme="@style/AppTheme.PopupOverlay"
        android:background="@drawable/menubar">

        <TextView
            android:id="@+id/tv_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:textStyle="bold"
            android:textSize="18dp"/>

        <TextView
            android:id="@+id/submitBtn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_gravity="end"
            android:layout_margin="10dp"
            android:onClick="clickToAddDiet"
            android:text="Save"
            android:textSize="18sp"
            android:textColor="#fff"/>
    </android.support.v7.widget.Toolbar>

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

<include layout="@layout/content_add_diet" />

Answer 1

您没有使用</android.support.design.widget.CoordinatorLayout> 关闭您的CoordinatorLayout。此外，您可能希望使用ConstraintLayout 使您包含的布局显示在您的AppBarLayout 下方。

Answer 2

确保在您应用的 build.gradle 文件中，您有正确的实现声明。它已从旧的“编译”语句更改为：

Android Studio 3 之前的版本

 compile 'com.android.support:design:25.3.1'

在 Android Studio 3 中

implementation 'com.android.support:design:26.1.0'

Answer 3

我遇到了同样的问题，点击布局编辑器中的信息图标后，我发现了原因：

将编辑器中的主题更改为AppCompat 或其他继承它的主题。为我工作。

Answer 4

我的目标是 android sdk 28 并使用了implementation 'com.android.support:design:28.+'，就在那时，我遇到了同样的问题。 然后我尝试了许多帖子上的所有解决方案，但都没有奏效，我什至手动添加了样式项，但它很烦人，所以我切换到implementation 'com.android.support:design:27.+'，然后效果很好。

Answer 5

在设计视图中将应用主题更改为“App compat:dialog”。这对我有用。

Answer 6

您可以尝试更改 Styles.xml 的内容 - "Theme.AppCompat.Light.DarkActionBar" 到 "Base.Theme.AppCompat.Light.DarkActionBar" 并重新构建了应用程序。

如果这不起作用尝试更改主题

Change the theme image 将主题更改为轻型版本。 Light theme selection image

Answer 7

只需将您的 android studio 更新到 3.2.1

Answer 8

从 3.1.1 更新到 Android Studio 3.2.1 修复了与坐标布局预览页面灰色 android 屏幕仅显示 (android...CoordinatorLayout) 并且屏幕上没有任何显示相关的所有问题

Android 3.2.1 here

Answer 9

@MateusGondim 在他的回答中提到的信息窗口也建议您清理并重建项目。我这样做了，错误消失了，布局预览又开始工作了。

Answer 10

就我而言，这发生在更新我的一些依赖项的版本之后。我唯一要做的就是重新编译我的项目。在 Android Studio 的文件菜单中，Build >> Make Project... 或 Ctrl+F9。之后，预览恢复正常。

Answer 11

这解决了我关于 Android 预览屏幕显示 android…coordinatorlayout

的问题

1.检查您的应用程序 gradle 构建文件中的依赖关系是否可能重复实现“com.android.support:design:28.0.0"”（不应重复）。

2.转到您的 res 文件夹 -> values -> styles 并更改您的应用主题 "Theme.AppCompat.Light.DarkActionBar"转"Base.Theme.AppCompat.Light.DarkActionBar"

1. 文件 -> 使缓存无效/重新启动 - 它对我有用，希望能有所帮助。

Answer 12

你可以做的事情

1. 刷新布局
2. 同步项目
3. 清理项目
4. 重建项目
5. 添加依赖实现 'com.google.android.material:material:1.4.0'
6. 构建项目（推荐，大部分布局问题将得到解决 通过这样做）
7. Refractor -> 迁移到 Androidx。