没有影子在默认情况下工具栏?

问题描述 投票:152回答:16

我更新我的应用程序与支持库V21新的工具栏。我的问题是,工具栏没有任何蒙上阴影,如果我不设置“高度”属性。那是正常的行为,或者说我做错了什么?

我的代码是:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:orientation="vertical">

   <android.support.v7.widget.Toolbar
       xmlns:app="http://schemas.android.com/apk/res-auto"
       android:id="@+id/my_awesome_toolbar"
       android:layout_width="match_parent"
       android:layout_height="wrap_content"
       android:background="?attr/colorPrimary"
       android:elevation="4dp"
       android:minHeight="?attr/actionBarSize"
       app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
       app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

   <FrameLayout
       android:id="@+id/FrameLayout1"
       android:layout_width="match_parent"
       android:layout_height="match_parent">
       .
       .
       .

在我的活动 - onCreate方法:

    Toolbar toolbar = (Toolbar) findViewById(R.id.my_awesome_toolbar);
    setSupportActionBar(toolbar);
android android-5.0-lollipop material-design android-toolbar
16个回答
243
投票

我结束了我的设置自己的阴影为工具栏,认为它可能为寻找它的帮助:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              xmlns:app="http://schemas.android.com/apk/res-auto"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:layout_gravity="top"
              android:orientation="vertical">

    <android.support.v7.widget.Toolbar android:id="@+id/toolbar"
                                       android:layout_width="match_parent"
                                       android:layout_height="wrap_content"
                                       android:background="@color/color_alizarin"
                                       android:titleTextAppearance="@color/White"
                                       app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

    <FrameLayout android:layout_width="match_parent"
                 android:layout_height="match_parent">

        <!-- **** Place Your Content Here **** -->

        <View android:layout_width="match_parent"
              android:layout_height="5dp"
              android:background="@drawable/toolbar_dropshadow"/>

    </FrameLayout>

</LinearLayout>

@绘制/ toolbar_dropshadow:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
       android:shape="rectangle">

    <gradient android:startColor="@android:color/transparent"
              android:endColor="#88333333"
              android:angle="90"/>

</shape>

@色/ color_alizarin

<color name="color_alizarin">#e74c3c</color>


4
投票

您还可以使它与Toolbar toolbar = (Toolbar)findViewById(R.id.toolbar); setSupportActionBar(toolbar); getSupportActionBar().setElevation(3.0f); 工作。这减少了布局嵌套一点点;)

<android.support.v7.widget.Toolbar
...
android:translationZ="5dp"/>

1
投票

actionbar_background.xml

RelativeLayout

添加到actionbar_style背景

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <include
        android:id="@+id/toolbar"
        layout="@layout/toolbar" />

    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/toolbar" />

    <View
        android:layout_width="match_parent"
        android:layout_height="5dp"
        android:layout_below="@id/toolbar"
        android:background="@drawable/toolbar_shadow" />
</RelativeLayout>

NAME = “displayOptions”> useLogo | showHome | showTitle | showCustom

添加到特马

    <item>
        <shape>
            <solid android:color="@color/black" />
            <corners android:radius="2dp" />
            <gradient
                android:startColor="@color/black"
                android:centerColor="@color/black"
                android:endColor="@color/white"
                android:angle="270" />
        </shape>
    </item>

    <item android:bottom="3dp" >
        <shape>

            <solid android:color="#ffffff" />
            <corners android:radius="1dp" />
        </shape>
    </item>
</layer-list>

1
投票

大多数解决方案很好地工作在这里。想显示另一个类似的选择:

gradle这个:

<style name="Theme.ActionBar" parent="style/Widget.AppCompat.Light.ActionBar.Solid">
    <item name="background">@drawable/actionbar_background</item>
    <item name="android:elevation">0dp</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:layout_marginBottom">5dp</item>

您可以布局有一个工具栏视图,并为它的影子,下面,类似这样的(当然需要修改):

<style name="BaseTheme" parent="Theme.AppCompat.Light">
   <item name="android:homeAsUpIndicator">@drawable/home_back</item>
   <item name="actionBarStyle">@style/Theme.ActionBar</item>
</style>

RES /抽拉-V21 / toolbar_action_bar_shadow.xml

implementation 'androidx.appcompat:appcompat:1.0.0-rc02'
implementation 'com.google.android.material:material:1.0.0-rc02'
implementation 'androidx.core:core-ktx:1.0.0-rc02'
implementation 'androidx.constraintlayout:constraintlayout:1.1.3'

RES /抽拉/ toolbar_action_bar_shadow.xml

<LinearLayout
    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:orientation="vertical">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:titleTextAppearance="@style/Base.TextAppearance.Widget.AppCompat.Toolbar.Title"/>

    <include
        layout="@layout/toolbar_action_bar_shadow"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"/>

</LinearLayout>

RES /抽拉/ msl__action_bar_shadow.xml

<androidx.appcompat.widget.AppCompatImageView
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="wrap_content" android:src="@drawable/msl__action_bar_shadow"/>

styles.xml

<FrameLayout
    xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent" android:layout_height="wrap_content"
    android:foreground="?android:windowContentOverlay" tools:ignore="UnusedAttribute"/>

Manaktivitykkt

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape
            android:dither="true"
            android:shape="rectangle" >
            <gradient
                android:angle="270"
                android:endColor="#00000000"
                android:startColor="#33000000" />

            <size android:height="10dp" />
        </shape>
    </item>

</layer-list>

全样本<resources> <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> <item name="colorAccent">@color/colorAccent</item> </style> </resources> ,因为我已经注意到了IDE有说class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) setContentView(R.layout.activity_main) setSupportActionBar(toolbar as Toolbar) } } 属性的错误是太新,在这里使用。


1
投票

所有你需要的是等于hereforeground。没有android:margin_bottomandroid:elevation等要求。

例:

AppBarLayout

0
投票

对于5.0 +:您可以使用AppBarLayout与工具栏。 AppBarLayout设置“高度”属性。

clipToPadding

0
投票

我有类似的问题的影子。阴影是在我的情况AppBarLayout的直接父绘制。如果家长的高度是一样的AppBarLayout的阴影无法绘制。所以检查父布局的大小和布局,也许翻拍就可以解决问题。 <?xml version="1.0" encoding="utf-8"?> <androidx.appcompat.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:layout_marginBottom="4dp" android:background="@android:color/white" android:elevation="4dp"> <androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent" android:layout_height="match_parent"> <!--Inner layout goes here--> </androidx.constraintlayout.widget.ConstraintLayout> </androidx.appcompat.widget.Toolbar>


0
投票

正确的答案是添加 机器人:backgroundTint =“#FF00FF”与机器人工具栏:背景=“@机器人:彩色/白”

如果使用其他颜色则白色为背景,将删除阴影。尼斯一个谷歌!


196
投票

谷歌发布的设计支持库中的几个星期前,有该库这个问题一记漂亮的解决方案。

添加设计支持库作为build.gradle依赖:

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

添加由库,成为您身边AppBarLayout布局的包装产生阴影提供Toolbar

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
       <android.support.v7.widget.Toolbar
           .../>
    </android.support.design.widget.AppBarLayout>

下面是结果:

有许多与设计支持库中的其他花样。

  1. http://inthecheesefactory.com/blog/android-design-support-library-codelab/en
  2. http://android-developers.blogspot.in/2015/05/android-design-support-library.html

AndroidX

和上述一样但相关性:

implementation 'com.google.android.material:material:1.0.0'

com.google.android.material.appbar.AppBarLayout


25
投票

您无法使用API​​ 21(运行Android Lollipop)之前的高程属性。您可以使用放置在工具栏下方的自定义视图但是添加阴影编程,例如。

@布局/工具栏

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/blue"
    android:minHeight="?attr/actionBarSize"
    app:theme="@style/ThemeOverlay.AppCompat.ActionBar" />

<View
    android:id="@+id/toolbar_shadow"
    android:layout_width="match_parent"
    android:layout_height="3dp"
    android:background="@drawable/toolbar_dropshadow" />

@绘制/ toolbar_dropshadow

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <gradient
        android:startColor="@android:color/transparent"
        android:endColor="#88333333"
        android:angle="90"/> </shape>

在你的活动布局<include layout="@layout/toolbar" />


17
投票

这个工作对我非常好:

<android.support.v7.widget.CardView
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/primary"
    card_view:cardElevation="4dp"
    card_view:cardCornerRadius="0dp">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/primary"
        android:minHeight="?attr/actionBarSize" />

</android.support.v7.widget.CardView>

17
投票

使用/文件夹值应用于基于OS版本正确的阴影样式。

对于小于5.0的设备,使用/values/styles.xml来windowContentOverlay添加到您的活动的主体:

<style name="MyViewArea">
    <item name="android:foreground">?android:windowContentOverlay</item>
</style>

<style name="MyToolbar">
    <item name="android:background">?attr/colorPrimary</item>
</style>

然后,通过改变你的主题,包括添加自定义的影子:

<item name="android:windowContentOverlay">@drawable/bottom_shadow</item>

你可以在这里抢谷歌的IO应用影子资源:https://github.com/google/iosched/blob/master/android/src/main/res/drawable-xxhdpi/bottom_shadow.9.png

5.0设备及更高版本,使用/values-v21/styles.xml高程添加到使用自定义标题样式工具栏:

<style name="MyViewArea">
</style>

<style name="MyToolbar">
    <item name="android:background">?attr/colorPrimary</item>
    <item name="android:elevation">4dp</item>
</style>

请注意,在第二种情况下,我不得不创建一个空的MyViewArea风格所以windowContentOverlay就不会出现了。

[更新:改变资源名称,并加入谷歌的影子。]


12
投票

如果您正在设置qazxsw POI作为qazxsw POI那么只要致电:

ToolBar

注意:这必须ActionBar后调用


7
投票

我的问题是,工具栏没有任何蒙上阴影,如果我不设置“高度”属性。那是正常的行为,或者说我做错了什么?

这是正常行为。还看到getSupportActionBar().setElevation(YOUR_ELEVATION); 结束的常见问题。


7
投票

与此玩弄了好几个小时,这里是为我工作。

取下setSupportActionBar(toolbar);this post小部件的所有elevation属性(包括appBarLayout如果你申请的任何造型)。

现在活动里面,适用于你的Toolbarstyles.xml

elvation

这应该工作。


5
投票

我加入

actionBar

在工具栏的描述,它为我工作。使用5.0+

© www.soinside.com 2019 - 2024. All rights reserved.