Wie ändere ich die Farbe der Symbolleisten-Zurück-Schaltfläche in Android?

96

Ich konnte die Farbe der Zurück-Taste nicht ändern. Ich verwende Symbolleistenmaterialdesign. In meiner App wende ich den schwarzen Hintergrund der Symbolleiste an, aber das Rückendesign ist standardmäßig schwarz. Deshalb möchte ich nur die Farbe dieser Zurück-Schaltfläche ändern. Bitte geben Sie mir Lösungen.

Danke

android 
— Nazima Kauser MMF
quelle
3
<style name = "MyMaterialTheme.Base" parent = "Theme.AppCompat.Light.DarkActionBar">
— Nazima Kauser MMF

Antworten:

77

Verwenden Sie diesen Stil 

<style name="Theme.MyFancyTheme" parent="android:Theme.Holo">
    <item name="android:homeAsUpIndicator">@drawable/back_button_image</item>
</style>
— Akhil Jayakumar
quelle
Ich benutze diesen Stil. Was muss ich in diesem Stil ändern?
— Nazima Kauser MMF
Sie können benutzerdefinierte Bilddateien für die Schaltfläche "Zurück" verwenden. Rufen Sie sie einfach in "@ drawable / your_image" auf
— Akhil Jayakumar
Dies ist der beste Weg, dies zu tun. Da die Verwendung von R.drawable.abc_ic_ab_back_mtrl_am_alpha zum Ändern der Farbe Risiken birgt, da die Support-Version die zeichnbare Ressource häufig ändert.
— Mostafa Imran
189

Sie können Ihrer styles.xml einen Stil hinzufügen. 

<style name="ToolbarTheme" parent="@style/ThemeOverlay.AppCompat.ActionBar">
  <!-- Customize color of navigation drawer icon and back arrow --> 
  <item name="colorControlNormal">@color/toolbar_color_control_normal</item>
</style>

und fügen Sie dies als Thema zu Ihrer Symbolleiste in der Symbolleiste layout.xml hinzu, indem Sie app: theme verwenden ( siehe unten)

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar 
    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:minHeight="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    app:theme="@style/ToolbarTheme" >
</android.support.v7.widget.Toolbar>
— Rajen Raiyarela
quelle
4
Arbeitete wie ein Zauber und klingt am besten geeignet.
— Vijay Kumar Kanta
1
Verflixt. Es klappt. Jetzt brauche ich nur noch etwas Äquivalentes für iOS. Vielen Dank!
— Ernesto
Wäre es besser, es ToolbarTheme zu nennen
— Leo Droidcoder
1
Bei mir hat <style name = "ToolbarTheme" parent = "@ style / Theme.AppCompat.NoActionBar"> funktioniert. Mein Haupt-App-Thema ist <style name = "AppTheme" parent = "Theme.AppCompat.NoActionBar">
— Yar
3
Es funktionierte. Dies ist angemessener als die akzeptierte Antwort.
— Domenico
85

Hier ist der einfachste Weg, um ein helles und dunkles Thema für die Symbolleiste zu erhalten. Sie müssen den Wert des Symbolleisten- app:themeTags ändern

  • Für den Titel der schwarzen Symbolleiste und den Pfeil nach oben sollte Ihre Symbolleiste das folgende Thema implementieren:

app: theme = "@ style / ThemeOverlay.AppCompat.Light"

Schwarzer Symbolleisten-Titel und Aufwärtspfeil

  • Für den Titel der weißen Symbolleiste und den Pfeil nach oben sollte Ihre Symbolleiste das folgende Thema implementieren:

app: theme = "@ style / ThemeOverlay.AppCompat"

Weißer Symbolleistentitel und Aufwärtspfeil

— ch3tanz
quelle
65
Verwenden Sie für den weißen Symbolleistentitel und den weißen Aufwärtspfeil das folgende Thema: android: theme = "@ style / ThemeOverlay.AppCompat.Dark.ActionBar"
— Amol Patil
Ich versuche zu verstehen, warum es ThemeOverlay heißt. Warum kann ich hier nicht einfach nur Theme.AppCompat.Dark.ActionBar verwenden?
— Gaket
@ ch3tanz Verwenden Sie ActionBar oder Toolbar? Warum verwenden Sie ActionBar-Stile?
— f470071
@ f470071 Ich benutze die Symbolleiste. Es ist nur Stil, der in allen Versionen unterstützt wird. Sie können Material Design-Stile verwenden, wenn Ihre App über Lollipop ausgerichtet ist.
— ch3tanz
Theme.AppCompat.Light.DarkActionBarin meinem Fall.
— Evi Song
30

Verwenden Sie für den weißen Symbolleistentitel und den weißen Aufwärtspfeil das folgende Thema: 

android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
— Pankaj Talaviya
quelle
Vielen Dank, vor allem die Lösung funktioniert nur bei mir.
— Md Juyel Rana
18

Benutze das:

<style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="colorControlNormal">@color/white</item> 
</style>
— Sabin Acharya
quelle
5
Dies sollte akzeptiert werden. Jede Antwort hier dient nur dazu, das Symbol zu ersetzen, nicht die Farbe.
— Michał Jabłoński
12

Versuche dies,

final Drawable upArrow = getResources().getDrawable(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
upArrow.setColorFilter(getResources().getColor(R.color.grey), PorterDuff.Mode.SRC_ATOP);
getSupportActionBar().setHomeAsUpIndicator(upArrow);
— Parth Bhayani
quelle
6

Wenn Sie eine weiße Zurück-Schaltfläche (←) und einen weißen Symbolleisten-Titel wünschen, gehen Sie wie folgt vor:

<android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
    </android.support.design.widget.AppBarLayout>

Ändern Sie das Thema von Darkin, Lightwenn Sie eine schwarze Zurück-Schaltfläche (←) und einen schwarzen Symbolleistentitel möchten.

— nhp
quelle
5

Sie können Ihr eigenes Symbol verwenden, indem Sie app:navigationIconund für die Titelfarbe verwendenapp:titleTextColor

Beispiel:

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?actionBarSize"
        android:background="@color/colorPrimary"
        app:navigationIcon="@drawable/ic_arrow_back_white_24dp"
        app:titleTextColor="@color/white" />
— Mohamed Nageh
quelle
Dies funktionierte für mich, setzen Sie einfach ein Symbol mit dieser Zeileapp:navigationIcon="@drawable/ic_back_black"
— Abhishek
Lichtung es hat geholfen.
— Mohamed Nageh
5

Sie müssen den Stil dafür nicht ändern. Nachdem Sie Ihre Symbolleiste als Aktionsleiste eingerichtet haben, können Sie wie folgt codieren

android.getSupportActionBar().setDisplayHomeAsUpEnabled(true);
android.getSupportActionBar().setHomeAsUpIndicator(R.drawable.back);
//here back is your drawable image

Mit dieser Methode können Sie die Farbe des Rückpfeils jedoch nicht ändern

— Nevil Ghelani
quelle
4

Ich denke, wenn Thema ein Problem generiert werden sollte, aber sein dynamisch gesetzter schwarzer Pfeil. Also schlug ich vor, versuchen Sie dieses.

Drawable backArrow = getResources().getDrawable(R.drawable.abc_ic_ab_back_mtrl_am_alpha);
backArrow.setColorFilter(getResources().getColor(R.color.md_grey_900), PorterDuff.Mode.SRC_ATOP);
getSupportActionBar().setHomeAsUpIndicator(backArrow);
— Siddharth Patel
quelle
1
Wie unterscheidet sich Ihre Lösung von @Parth Bhayani?
— CoolMind
3

Ich verwende das <style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar>Thema in meiner Android-Anwendung und im NoActionBar-Thema.colorControlNormal Eigenschaft verwendet, um die Farbe des Standardpfeils der Zurück-Schaltfläche des Navigationssymbols in meiner Symbolleiste zu ändern

styles.xml

<style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="colorControlNormal">@color/your_color</item> 
</style>
— Android Player_Shreeya
quelle
3

Verwenden Sie einfach die MaterialToolbarund überschreiben Sie die Standardfarben:

    <com.google.android.material.appbar.MaterialToolbar
        style="@style/Widget.MaterialComponents.Toolbar.Primary"
        android:theme="@style/MyThemeOverlay_Toolbar"
        ..>

mit:

  <style name="MyThemeOverlay_Toolbar" parent="ThemeOverlay.MaterialComponents.Toolbar.Primary">
    <!-- color used by navigation icon and overflow icon -->
    <item name="colorOnPrimary">@color/...</item>
  </style>

Geben Sie hier die Bildbeschreibung ein

Wenn Sie das androidx.appcompat.widget.Toolbaroder das MaterialToolbar mit dem Standardstil ( Widget.MaterialComponents.Toolbar) verwenden, können Sie Folgendes verwenden:

<androidx.appcompat.widget.Toolbar
    android:theme="@style/MyThemeOverlay_Toolbar2"

mit:

  <style name="MyThemeOverlay_Toolbar2" parent="ThemeOverlay.MaterialComponents.Toolbar.Primary">
    <!-- This attributes is used by title -->
    <item name="android:textColorPrimary">@color/white</item>

    <!-- This attributes is used by navigation icon and overflow icon -->
    <item name="colorOnPrimary">@color/secondaryColor</item>
  </style>
— Gabriele Mariotti
quelle
2

Einfach und ohne Sorgen

 <?xml version="1.0" encoding="utf-8"?>
    <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.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:titleTextColor="@color/white"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

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

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

    </android.support.design.widget.CoordinatorLayout>
— Nullzeiger-Ausnahme
quelle
2

Ich habe es so gemacht, indem ich die Material Components Library verwendet habe:

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    <item name="drawerArrowStyle">@style/AppTheme.DrawerArrowToggle</item>
</style>

<style name="AppTheme.DrawerArrowToggle" parent="Widget.AppCompat.DrawerArrowToggle">
    <item name="color">@android:color/white</item>
</style>
— Sam
quelle
Dies funktioniert: Sie können die Farbe des Hamburger-Menüsymbols ändern.
— lnaie
1

Sie können diesen Code zu Ihrer Java-Klasse hinzufügen. Sie müssen jedoch zuvor ein Vektor-Asset erstellen, damit Sie Ihren Pfeil zurück anpassen können.

actionBar.setHomeAsUpIndicator(R.drawable.ic_arrow_back_black_24dp);
— Mochamad Fandi
quelle
-1

Wenn Sie eine Systemrückfarbe in Weiß wünschen , können Sie diesen Code verwenden

<com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:elevation="0dp"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar_notification"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:contentInsetLeft="0dp"
            app:contentInsetStart="0dp"
            app:contentInsetStartWithNavigation="0dp">

            <include layout="@layout/action_bar_notification" />
        </androidx.appcompat.widget.Toolbar>
    </com.google.android.material.appbar.AppBarLayout>

Hinweis: - android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" ist der Schlüssel

Das Einfügen befindet sich in Ihrer Aktivität, in der Sie die Schaltfläche "Zurück" in der Aktionsleiste anzeigen möchten

final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar_notification);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(false);
— iamkdblue
quelle
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.