时间戳

首页 > 解决方案 > 如何根据自己的喜好控制材质工具栏的高度？

android - 如何根据自己的喜好控制材质工具栏的高度？

问题描述

这是我的布局文件，如您所见，我没有使用主题附带的 AppBar，而是使用自定义工具栏。

代码：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
    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:id="@+id/dice_roller_activity"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="center"
    tools:context=".MainActivity">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/app_bar_layout"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.appbar.MaterialToolbar
            android:id="@+id/activity_toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:title="@string/app_name" />

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

    <ImageView.../>

    <Button.../>

</androidx.constraintlayout.widget.ConstraintLayout>

这就是它的样子：https ://imgur.com/cPSFads

（注意这里没有elevation使用属性）。

我正在从Theme.MaterialComponents.Light.NoActionBar主题扩展以能够使用我自己的自定义ToolBar. 现在的问题是，我找不到改变工具栏高度的方法。为了改变海拔，我尝试使用android:elevation<AppBarLayout> 标签内的属性，如下所示：

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/app_bar_layout"
        ...
        android:elevation="4dp"
        ...>

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

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

正如您在此处看到的那样，它没有任何区别 （我已经尝试了从 0dp 到 4dp 的所有值，它没有任何区别）

然后我在android:elevation<AppBarLayout> 的子标签内添加了相同的属性，即 <MaterialToolbar> 标签，如下所示：

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

         <com.google.android.material.appbar.MaterialToolbar
              android:id="@+id/activity_toolbar"
              ...
              android:elevation="4dp"
              ... />

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

这导致了像这样的可怕混乱， 这绝对不是我想要的。

然后我尝试app:elevation了在 <com.google.android.material.appbar.MaterialToolbar/> 标签中使用时没有做任何更改的属性，无论我使用的值如何，但是当我app:elevation在 <com.google.android 中尝试相同的属性时.material.appbar.AppBarLayout>，它去掉了原始截图中可以看到的一点点高程（显示了没有elevation使用属性时应用程序的状态），并使它看起来像这样（注意没有高程不再在顶部栏中）。

我不只是想增加更多的高度或降低高度，我希望能够控制它。我知道已经有足够的海拔来遵守材料指南，但我想让它像没有海拔的谷歌新闻应用程序一样，或者我可能想让它像股票 android 中的设置页面一样，那里有足够的海拔使它看起来既漂亮又与布局的其余部分区分开来。

如果需要更多信息，您可以查看我制作的此应用的 github 存储库：https ://github.com/sbeve72/diceroller/tree/unguided-development

PS：我是初学者，你可能已经注意到这只是你在谷歌上 Udacity 课程时制作的第一个应用程序。

标签： androidxmlandroid-layoutmaterial-designandroid-toolbar

解决方案

尝试删除AppBarLayout并设置android:background您的MaterialToolbar，届时可以控制海拔android:elevation：

<com.google.android.material.appbar.MaterialToolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="@color/colorPrimary"
    android:elevation="0dp" />

查看最新的 Material Design Library 稳定版 1.4

推荐阅读