在工具栏上为棒棒糖前设备添加高程/阴影 [英] Add elevation/shadow on toolbar for pre-lollipop devices

问题描述

我将我的 android 应用程序更新为新的材料设计，但我还想为工具栏添加一些阴影或高度.似乎有一些(hacky)方法可以通过图像/9 补丁来完成，但我想知道是否可以通过支持库来完成.(就像 CardView 可以有高度一样)

I updated my android app to the new material design, but I also wanted to add some shadow or elevation to the Toolbar. There seem to be some (hacky) ways of doing it via images/9-patches, but I wonder if it can be done via the support libraries. (just like the CardView can have elevation)

根据 this 对另一个问题的回答，这可以通过将 Toolbar 包装在一个 AppBarLayout，但这对我不起作用.

According to this answer on another question, this is possible by wrapping the Toolbar in a AppBarLayout, but this doesn't work for me.

我的布局:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.AppBarLayout 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="wrap_content">
    <android.support.v7.widget.Toolbar
            android:id="@+id/Toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:minHeight="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>

我也尝试通过 XML 和代码设置提升，但这也不起作用.

I also tried setting elevation via XML and through code, but that doesn't work either.

任何帮助将不胜感激！提前致谢.

Any help would be appreciated! Thanks in advance.

更新:

由于我在其他布局中包含了我的工具栏布局，下面是我的主要布局之一:

Since I include my Toolbar layout in my other layouts, below is one of my main layouts:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <include
        layout="@layout/Toolbar" />
    <fragment
        class="OverAllField.XamarinAndroid.Fragments.Planning.PlanningFragment"
        android:id="@+id/PlanningFragment"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />
</LinearLayout>

推荐答案

对于 Android 5.0 及更高版本:AppBarLayout 自动在布局中提供/给予阴影.您还可以通过 app:elevation="4dp" 增加 AppBarLayout 的高度.

For Android 5.0 and above : AppBarLayout automatically provides/gives shadow in the layout. You can also increase the elevation of the AppBarLayout by app:elevation="4dp".

对于 Pre-Lollipop :您可以使用以下链接:https://github.com/vipulasri/Toolbar-Elevation-Pre-Lollipop

For Pre-Lollipop : You can use the following link: https://github.com/vipulasri/Toolbar-Elevation-Pre-Lollipop

注意:工具栏也支持提升它，使用android:elevation="4dp"

Note: Toolbar also supports elevation to it, using android:elevation="4dp"

新更新:在Appcompat v24.0.0中，您无法使用setElevation() 和app 将海拔设置为AppBarLayout:海拔 因为这些已被弃用.

New Update: In Appcompat v24.0.0, you can not set elevation to AppBarLayout using setElevation() and app:elevation as these are deprecated.

您现在必须使用 stateListAnimator 属性来设置高程.

You have to use stateListAnimator property to set elevation now.

注意:在StateListAnimator中将持续时间设置为1ms，以避免高程绘制延迟.

Note: set duration to 1ms in StateListAnimator in order to avoid delay in Elevation Drawing.

AppBarLayout 海拔变化在 appCompat v24 上延迟.0.0

appbar_always_elevated.xml 位于res 目录下的animator-v21 文件夹中.

appbar_always_elevated.xml in animator-v21 folder under res directory.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
    <objectAnimator android:propertyName="elevation"
                    android:valueTo="8dp" 
                    android:valueType="floatType"
                    android:duration="1"/>
</item>
</selector>

在 AppbarLayout 中:

In AppbarLayout :

<android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:fitsSystemWindows="true"
        android:stateListAnimator="@animator/appbar_always_elevated"
        android:theme="@style/AppTheme.AppBarOverlay">

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

这篇关于在工具栏上为棒棒糖前设备添加高程/阴影的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！