Bagaimana cara mengubah warna tombol kembali Toolbar di Android?

100

Saya tidak bisa mengubah warna tombol kembali. Saya menggunakan desain material toolbar. Di aplikasi saya, saya menerapkan latar belakang hitam bilah alat tetapi desain belakang menjadi hitam secara default, itulah sebabnya saya hanya ingin mengubah warna tombol kembali ini. Tolong beri saya solusi.

Terima kasih

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

Jawaban:

80

gunakan gaya ini 

<style name="Theme.MyFancyTheme" parent="android:Theme.Holo">
    <item name="android:homeAsUpIndicator">@drawable/back_button_image</item>
</style>
— Akhil Jayakumar
sumber
saya menggunakan gaya ini. apa yang harus saya ubah dalam gaya ini?
— Nazima Kauser MMF
Anda dapat menggunakan file gambar khusus untuk tombol kembali. sebut saja di `@ drawable / your_image '
— Akhil Jayakumar
Ini cara terbaik untuk melakukannya. Karena menggunakan R.drawable.abc_ic_ab_back_mtrl_am_alpha untuk mengubah warna memiliki risiko, karena versi dukungan sering mengubah sumber daya dapat digambar.
— Mostafa Imran
196

Anda dapat menambahkan gaya ke styles.xml Anda, 

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

dan tambahkan ini sebagai tema ke toolbar Anda di toolbar layout.xml menggunakan app: theme , periksa di bawah

<?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
sumber
4
Bekerja seperti pesona, dan terdengar paling tepat.
— Vijay Kumar Kanta
1
Menisik. Berhasil. Sekarang saya hanya butuh sesuatu yang setara untuk iOS. Terima kasih!
— Ernesto
Akan lebih baik menyebutnya ToolbarTheme
— Leo Droidcoder
1
Bagi saya <style name = "ToolbarTheme" parent = "@ style / Theme.AppCompat.NoActionBar"> berhasil. Tema aplikasi utama saya adalah <style name = "AppTheme" parent = "Theme.AppCompat.NoActionBar">
— Yar
3
Berhasil. Ini lebih tepat daripada jawaban yang diterima.
— Domenico
86

Berikut adalah cara termudah untuk mendapatkan Tema Terang dan Gelap untuk app:themeToolbar. Anda harus mengubah nilai dari tag Toolbar

  • Untuk Judul Toolbar Hitam dan panah Hitam , toolbar Anda harus menerapkan tema berikut:

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

Judul Bilah Alat Hitam dan Panah Atas

  • Untuk Judul Bilah Alat Putih dan panah Putih ke Atas , bilah alat Anda harus menerapkan tema berikut:

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

Judul Toolbar Putih dan Panah Atas

— ch3tanz.dll
sumber
66
Untuk Judul Toolbar putih dan panah Putih, gunakan tema berikut: android: theme = "@ style / ThemeOverlay.AppCompat.Dark.ActionBar"
— Amol Patil
Saya mencoba untuk memahami, mengapa dinamai ThemeOverlay? Mengapa saya tidak dapat menggunakan Theme.AppCompat.Dark.ActionBar sederhana di sini?
— Gaket
@ ch3tanz Apakah Anda menggunakan ActionBar atau Toolbar? Mengapa Anda menggunakan gaya ActionBar?
— f470071
@ f470071 Saya menggunakan Toolbar. Ini hanya gaya yang akan mendukung semua versi. Anda dapat menggunakan gaya Desain Material jika aplikasi Anda menargetkan di atas Lollipop.
— ch3tanz
Theme.AppCompat.Light.DarkActionBardalam kasus saya.
— Evi Song
30

Untuk Judul Toolbar putih dan panah Putih, gunakan tema berikut: 

android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
— Pankaj Talaviya
sumber
Terima kasih banyak, di atas semua penyelesaian hanya berhasil untuk saya.
— Md Juyel Rana
21

Gunakan ini:

<style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <item name="colorControlNormal">@color/white</item> 
</style>
— Sabin Acharya
sumber
5
Ini harus diterima. Setiap jawaban di sini hanya untuk mengganti ikon, bukan warnanya.
— Michał Jabłoński
12

Coba ini,

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

Anda tidak perlu mengubah gaya untuk itu. Setelah mengatur toolbar Anda sebagai actionbar, Anda dapat membuat kode seperti ini

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

Tetapi Anda tidak dapat mengubah warna panah belakang dengan metode ini

— Nevil Ghelani
sumber
6

Jika Anda menginginkan tombol kembali berwarna putih (←) dan judul bilah alat berwarna putih, ikuti ini:

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

Ubah tema dari Darkmenjadi Lightjika Anda ingin tombol kembali hitam (←) dan judul bilah alat hitam.

— nhp
sumber
5

Anda dapat menggunakan ikon Anda sendiri dengan menggunakan app:navigationIcondan untuk warna judulapp:titleTextColor

Contoh:

<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
sumber
Ini berfungsi untuk saya, cukup setel ikon apa pun menggunakan baris iniapp:navigationIcon="@drawable/ic_back_black"
— Abhishek
rawa itu membantu.
— Mohamed Nageh
5

Cukup gunakan MaterialToolbardan timpa warna default:

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

dengan:

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

masukkan deskripsi gambar di sini

Jika Anda menggunakan androidx.appcompat.widget.Toolbaratau MaterialToolbar dengan gaya default ( Widget.MaterialComponents.Toolbar) Anda dapat menggunakan:

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

dengan:

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

Saya pikir jika tema harus menghasilkan beberapa masalah tetapi panah hitamnya diatur secara dinamis. Jadi saya menyarankan untuk mencoba yang ini.

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
sumber
2
Apa perbedaan solusi Anda dengan @Parth Bhayani?
— CoolMind
3

Saya menggunakan <style name="BaseTheme" parent="Theme.AppCompat.Light.NoActionBar>tema di aplikasi android saya dan di tema NoActionBar, colorControlNormalproperti digunakan untuk mengubah warna ikon navigasi default panah tombol Kembali di toolbar saya

styles.xml

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

Sederhana dan tidak perlu khawatir

 <?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>
— Pengecualian Pointer Null
sumber
2

Saya melakukannya dengan cara ini menggunakan pustaka Komponen Material:

<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
sumber
ini berfungsi: ini memungkinkan Anda untuk mengubah warna ikon menu hamburger.
— lnaie
1

Anda dapat menambahkan kode ini ke dalam kelas java Anda. Tetapi Anda harus membuat aset vektor sebelumnya, sehingga Anda dapat menyesuaikan kembali panah Anda.

actionBar.setHomeAsUpIndicator(R.drawable.ic_arrow_back_black_24dp);
— Mochamad Fandi
sumber
0

Untuk menata Toolbar di Android 21+ ini sedikit berbeda.

<style name="DarkTheme.v21" parent="DarkTheme.v19">
        <!-- toolbar background color -->
        <item name="android:navigationBarColor">@color/color_primary_blue_dark</item>
        <!-- toolbar back button color -->
        <item name="toolbarNavigationButtonStyle">@style/Toolbar.Button.Navigation.Tinted</item>
    </style>

    <style name="Toolbar.Button.Navigation.Tinted" parent="Widget.AppCompat.Toolbar.Button.Navigation">
        <item name="tint">@color/color_white</item>
    </style>
— Pedro Romão
sumber
-1

Jika Anda ingin warna belakang sistem putih maka Anda dapat menggunakan kode ini

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

Catatan: - android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" adalah kuncinya

Tempel ada di aktivitas Anda di mana Anda ingin menampilkan tombol kembali di bilah tindakan

final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar_notification);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(false);
— iamkdblue
sumber
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.