Cara menyetel teks Toolbar dan warna panah mundur


116

Latar belakang bilah alat berwarna gelap, saya ingin teks dan panah belakang menjadi putih. Saya mencoba mengikuti, tetapi tidak berhasil.

<style name="Theme.MyTheme" parent="Theme.AppCompat.Light.NoActionBar">

        <item name="colorPrimary">@color/blue</item>
        <item name="colorPrimaryDark">@color/blue_darker</item>
        <item name="colorAccent">@color/purple</item>
        <!-- item name="android:textColorPrimary">@color/white</item--> // I don't want to set this, changes everywhere. 
        <item name="android:textColorSecondary">@color/white</item>
        <item name="android:toolbarStyle">@style/AppTheme.ToolbarStyle</item>
        <item name="toolbarStyle">@style/AppTheme.ToolbarStyle</item>

        <item name="drawerArrowStyle">@style/AppTheme.DrawerArrowStyle</item>

    </style>

    <style name="AppTheme.ToolbarStyle" parent="Base.Widget.AppCompat.Toolbar">
        <!--<item name="actionOverflowButtonStyle">@style/AppTheme.OverflowButtonStyle</item>-->
        <item name="android:textColor">@color/white</item> // doesn't work
        <item name="titleTextAppearance">@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse</item>
        <item name="android:titleTextAppearance">@style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse</item>
        <item name="subtitleTextAppearance">@style/TextAppearance.Widget.AppCompat.Toolbar.Subtitle</item>
    </style>

10
Cobalah untuk menambahkan app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"ke Anda <android.support.v7.widget.Toolbar>; panah kembali dan teks akan menjadi putih, seperti kata @yubarajpoudel.
1111161171159459134

Jawaban:


153

Kemungkinan Anda keluar dari orang tua yang salah. Jika tidak, Anda dapat mencoba menambahkan styleke toolbartata letak secara langsung, jika Anda ingin mengganti pengaturan tema.

Dalam tata letak bilah alat Anda:

 <android.support.v7.widget.Toolbar
      xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto"
      android:id="@+id/toolbar"
      android:layout_width="match_parent"
      android:layout_height="?attr/actionBarSize"
      android:minHeight="?attr/actionBarSize"
      app:theme="@style/ToolBarStyle"
      app:popupTheme="@style/ToolBarPopupStyle"
      android:background="@color/actionbar_color" />

Dalam gaya Anda:

 <!-- ToolBar -->
  <style name="ToolBarStyle" parent="Theme.AppCompat">
      <item name="android:textColorPrimary">@android:color/white</item>
      <item name="android:textColorSecondary">@android:color/white</item>
      <item name="actionMenuTextColor">@android:color/white</item>      
      <item name="actionOverflowButtonStyle">@style/ActionButtonOverflowStyle</item>
      <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
 </style>

5
memberikan kesalahan saat menambahkan gaya ini ke styles.xmlfile
Gopal Singh Sirvi

1
Anda tidak memerlukan bagian drawerArrowStyle untuk menjawab pertanyaan
luckyhandler

124

Tambahkan yang berikut ini sebagai toolbar.xml

<?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:id="@+id/toolbar"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:fitsSystemWindows="true"
    android:minHeight="?attr/actionBarSize"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    android:background="?attr/colorPrimary">

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

Kemudian di tata letak yang Anda butuhkan

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

Nikmati


10
Ya, berhasil! Khususnya app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar".
1111161171159459134

1
Seharusnya<include layout="@layout/toolbar"/>
Tim

63

Di dalam Aktivitas, Anda dapat menggunakan

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);
    toolbar.setTitleTextColor(getResources().getColor(android.R.color.white));

Jika Anda suka memilih xml untuk warna judul & panah kembali putih, cukup tambahkan gaya ini di style.xml.

 <style name="ToolBarStyle" parent="Theme.AppCompat">
    <item name="android:textColorPrimary">@android:color/white</item>
    <item name="android:textColorSecondary">@android:color/white</item>
    <item name="actionMenuTextColor">@android:color/white</item>
</style>

Dan toolbar terlihat seperti:

 <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        app:theme="@style/ToolBarStyle"
        android:layout_height="?attr/actionBarSize"
  />

1
INI BEKERJA! Begitu banyak jawaban acak - Saya pikir hal yang perlu diperhatikan adalah ini berfungsi untuk: android.support.v7.widget.Toolbar bersarang di dalam: android.support.design.widget.AppBarLayout Terima kasih banyak
Sagar Patel

1
solusi java tidak mengubah warna panah
java-love

19

Solusi ini mungkin lebih mudah. Tetapi itu membutuhkan versi API yang lebih tinggi (23). cukup tambahkan kode ini ke toolbar Anda dalam XML:

<Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?android:attr/actionBarSize"
    android:background="?android:attr/colorPrimary"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    android:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    android:titleTextColor="#ffffffff" />

@Vyintas benar
Tom Esendam

1
Tidak perlu menyetel android: titleTextColor = "# ffffffff", cukup android: theme = "@ style / ThemeOverlay.AppCompat.Dark.ActionBar" dan app: popupTheme = "@ style / ThemeOverlay.AppCompat.Light"
Almeida

16

Jika Anda menggunakan AndroidX(per Juli 2019) Anda dapat menambahkan ini:

<androidx.appcompat.widget.Toolbar
  android:id="@+id/toolbar"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  app:layout_collapseMode="pin"
  app:theme="@style/ThemeOverlay.MaterialComponents.Dark.ActionBar"
  app:popupTheme="@style/ThemeOverlay.MaterialComponents.Light"/>

CATATAN! Ini telah diuji untuk bekerja jika Anda Toolbarditempatkan langsung di dalam AppBarLayouttetapi tidak di dalamCollapsingToolbarLayout


9
<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/colorPrimaryDark"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.AppBarLayout>

Inilah jawabannya jika Anda memiliki ekstensi appbarlayout. Terima kasih!
Nuhman

8

metode ini membantu saya.

<style name="AppTheme" parent="Theme.AppCompat.Light">
        <item name="colorPrimary">@color/primary</item>
        <item name="colorPrimaryDark">@color/primaryDark</item>
        <item name="colorAccent">@color/highlightRed</item>
        <item name="actionBarTheme">@style/ToolbarStyle</item>
</style>

<style name="ToolbarStyle" parent="Widget.AppCompat.ActionBar">
        <item name="android:textColorPrimary">@color/white</item>
</style>

6
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/actionBar"
app:titleTextAppearance="@style/ToolbarTitleText"
app:theme="@style/ToolBarStyle">

<TextView
    android:id="@+id/title"
    style="@style/ToolbarTitleText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:text="hh"/>

<!-- ToolBar -->
<style name="ToolBarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="actionMenuTextColor">#ff63BBF7</item>
</style>

gunakan app: theme = "@ style / ToolBarStyle"

Sumber referensi : http: //blog.csdn.net/wyyl1/article/details/45972371


1
Tolong jelaskan jawaban Anda, hanya memposting kode tidak terlalu jelas untuk menjawab pertanyaan.
SuperBiasedMan

3

Coba ini pada file XML Anda

<android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        app:titleTextColor="@color/colorAccent"
        app:theme="@style/ToolbarColoredBackArrow"
        app:subtitleTextColor="@color/colorAccent"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay" />

Dan tambahkan ini adalah file colors.xml Anda

    <color name="colorAccent">YOUR_COLOR</color>

1
Bisakah Anda berbagi dengan kami apa yang ada di aplikasi: theme = "@ style / ToolbarColoredBackArrow"
Simon

3

Tambahkan baris ini ke Toolbar. 100% bekerja

android:theme="@style/Theme.AppCompat.Light.DarkActionBar"

1

Coba banyak metode, dalam versi rendah dari API, metode yang layak adalah <item name="actionMenuTextColor">@color/your_color</item> dan jangan gunakan namespace Android

ps:

  <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>

    <!-- change the textColor -->
    <item name="actionMenuTextColor">@color/actionMenuTextColor</item>
</style>

1

Saya menggunakan placeholder jadi ikuti saja, karena Anda mungkin ingin tetap mempertahankan warisan dari gaya aslinya.

Sebelum

<android.support.v7.widget.Toolbar
    android:id="@+id/toolBar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/{{originalBaseStyle}}"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

Setelah:

styles.xml

<style name="{{yourToolbarStyle}}" parent="{{originalBaseStyle}}">
    <item name="android:textColorPrimary">@android:color/white</item>
    <item name="android:textColorSecondary">@android:color/white</item>
    <item name="actionMenuTextColor">@android:color/white</item>
    <item name="actionOverflowButtonStyle">@style/ActionButtonOverflowStyle</item>
    <item name="drawerArrowStyle">@style/DrawerArrowStyle</item>
</style>

Karena itu

<android.support.v7.widget.Toolbar
    android:id="@+id/toolBar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:theme="@style/{{yourToolbarStyle}}"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

1

Jika kita mengikuti template aktivitas yang dibuat oleh Android Studios, AppBarLayout-lah yang perlu memiliki tema Android AppBarOverlay, yang harus Anda tentukan di styles.xml Anda. Itu akan memberi Anda warna putih teks warna toobar / actionbar.

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">  ...

Di styles.xml, pastikan yang berikut ini ada:

<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

1

Pendekatan ini berhasil untuk saya menggunakan pustaka Komponen Material:

Masuk styles.xml:

<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
    <!-- Your styles here -->

    <item name="toolbarStyle">@style/AppTheme.Toolbar</item>
</style>

<style name="AppTheme.Toolbar" parent="Widget.MaterialComponents.Toolbar">
    <item name="titleTextColor">@android:color/white</item>
</style>

Diadaptasi dari jawaban ini: https://stackoverflow.com/a/48205577/238753


0

Untuk mengubah drawable ikon belakang Toolbar, Anda dapat menggunakan ini:
Tambahkan <item name="toolbarStyle">@style/ToolbarStyle</item>ke dalam Tema Anda.
Dan inilah ToolbarStyledirinya sendiri:

<style name="ToolbarStyle" parent="Widget.AppCompat.Toolbar">
    <item name="navigationIcon">@drawable/ic_up_indicator</item>
</style>

0

Jika menggunakan iterasi terbaru Android Studio 3.0 dan membuat kelas Aktivitas Anda, dalam file gaya Anda ubah ini:

<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

Untuk ini:

<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.ActionBar" />
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.