Ich aktualisiere meine App mit der neuen Symbolleiste aus der Support-Bibliothek v21. Mein Problem ist, dass die Symbolleiste keinen Schatten wirft, wenn ich das Attribut "Höhe" nicht festlege. Ist das das normale Verhalten oder mache ich etwas falsch?

Mein Code lautet:

<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">
       .
       .
       .

Und in meiner Aktivität - OnCreate-Methode:

    Toolbar toolbar = (Toolbar) findViewById(R.id.my_awesome_toolbar);
    setSupportActionBar(toolbar);

Am Ende habe ich meinen eigenen Schlagschatten für die Symbolleiste festgelegt und dachte, er könnte für jeden hilfreich sein, der danach sucht:

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

@ drawable / 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 / color_alizarin

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

Google hat die Design Support-Bibliothek vor einigen Wochen veröffentlicht. In dieser Bibliothek gibt es eine raffinierte Lösung für dieses Problem.

Fügen Sie die Design Support-Bibliothek als Abhängigkeit hinzu in build.gradle:

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

Fügen Sie AppBarLayoutvon der Bibliothek bereitgestelltes Wrapper um Ihr ToolbarLayout hinzu, um einen Schlagschatten zu erzeugen.

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

Hier ist das Ergebnis:

Es gibt viele andere Tricks mit der Design-Support-Bibliothek.

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

Wie oben, jedoch mit Abhängigkeit:

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

und com.google.android.material.appbar.AppBarLayout

Sie können das Höhenattribut nicht vor API 21 (Android Lollipop) verwenden. Sie können den Schatten jedoch programmgesteuert hinzufügen, z. B. mithilfe einer benutzerdefinierten Ansicht unterhalb der Symbolleiste.

@ Layout / Symbolleiste

<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" />

@ drawable / 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>

in Ihrem Aktivitätslayout <include layout="@layout/toolbar" />

Verwenden Sie die Ordner / values , um den richtigen Schattenstil basierend auf der Betriebssystemversion anzuwenden.

Verwenden Sie für Geräte unter 5.0 /values/styles.xml , um windowContentOverlay zum Hauptteil Ihrer Aktivität hinzuzufügen :

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

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

Fügen Sie dann Ihren eigenen Schatten hinzu, indem Sie Ihr Thema so ändern, dass es Folgendes enthält:

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

Sie können die Schattenressource der IO-App von Google hier herunterladen : https://github.com/google/iosched/blob/master/android/src/main/res/drawable-xxhdpi/bottom_shadow.9.png

Verwenden Sie für Geräte der Version 5.0 und höher /values-v21/styles.xml , um Ihrer Symbolleiste mithilfe eines benutzerdefinierten Kopfzeilenstils eine Höhe hinzuzufügen :

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

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

Beachten Sie, dass ich im zweiten Fall einen leeren MyViewArea- Stil erstellen musste, damit windowContentOverlay angezeigt wird nicht wird.

[Update: Ressourcennamen geändert und Google Shadow hinzugefügt.]

Das hat bei mir sehr gut funktioniert:

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

Wenn Sie das ToolBarals einstellen, ActionBarrufen Sie einfach an:

getSupportActionBar().setElevation(YOUR_ELEVATION);

Hinweis: Dies muss nach aufgerufen werden setSupportActionBar(toolbar);

Ich fügte hinzu

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

in der Symbolleistenbeschreibung und es funktioniert für mich. Verwenden von 5.0+

Mein Problem ist, dass die Symbolleiste keinen Schatten wirft, wenn ich das Attribut "Höhe" nicht festlege. Ist das das normale Verhalten oder mache ich etwas falsch?

Das ist das normale Verhalten. Siehe auch die FAQ am Ende dieses Beitrags .

Ich habe stundenlang damit gespielt, hier ist, was für mich funktioniert hat.

Entfernen Sie alle elevationAttribute aus den Widgets appBarLayoutund Toolbar(auch styles.xmlwenn Sie ein Styling anwenden).

Wenden Sie nun innerhalb der Aktivität Folgendes elvationan actionBar:

Toolbar toolbar = (Toolbar)findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setElevation(3.0f);

Das sollte funktionieren.

Sie können es auch zum Laufen bringen RelativeLayout. Dies reduziert die Verschachtelung des Layouts ein wenig;)

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

Alles was Sie brauchen ist android:margin_bottomgleich dem android:elevationWert. Nein AppBarLayout, clipToPaddingusw. erforderlich.

Beispiel:

<?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>

Für 5.0 +: Sie können AppBarLayout mit Symbolleiste verwenden. AppBarLayout hat die Zuordnung "Höhe".

 <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:elevation="4dp"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <include layout="@layout/toolbar" />
    </android.support.design.widget.AppBarLayout>

actionbar_background.xml

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

zum actionbar_style Hintergrund hinzufügen

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

name = "displayOptions"> useLogo | showHome | showTitle | showCustom

zu Basetheme hinzufügen

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

Die meisten Lösungen funktionieren hier einwandfrei. Möchte eine andere, ähnliche Alternative zeigen:

Gradle:

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'

Ihr Layout kann eine Symbolleistenansicht und einen Schatten dafür haben, ähnlich wie dieser (muss natürlich geändert werden):

<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 / drawable-v21 / toolbar_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"/>

res / drawable / toolbar_action_bar_shadow.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"/>

res / drawable / msl__action_bar_shadow.xml

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

styles.xml

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

MainActivity.kt

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        setSupportActionBar(toolbar as Toolbar)
    }
}

Vollständiges Beispiel hier , da ich festgestellt habe, dass die IDE den Fehler hat, dass das foregroundAttribut zu neu ist, um hier verwendet zu werden.

Ich hatte ein ähnliches Problem mit dem Schatten. Der Schatten wird in meinem Fall vom direkten übergeordneten Element von AppBarLayout gezeichnet. Wenn die Höhe des übergeordneten Elements mit der von AppBarLayout übereinstimmt, kann der Schatten nicht gezeichnet werden. Das Überprüfen der Größe des übergeordneten Layouts und möglicherweise des Layout-Remakes kann das Problem lösen. https://www.reddit.com/r/androiddev/comments/6xddb0/having_a_toolbar_as_a_fragment_the_shadow/

Die richtige Antwort ist,
android: backgroundTint = "# ff00ff" zur Symbolleiste mit android: background = "@ android: color / white" hinzuzufügen.

Wenn Sie eine andere Farbe als Weiß als Hintergrund verwenden, wird der Schatten entfernt. Netter Google!