Kolor tekstu ActionBar


288

jak mogę zmienić kolor tekstu paska ActionBar? Odziedziczyłem motyw Holo Light, jestem w stanie zmienić tło paska ActionBar, ale nie wiem, jaki jest atrybut dostrajania w celu zmiany koloru tekstu.


Ok, jestem w stanie zmienić kolor tekstu za pomocą atrybutu android: textColorPrimary, ale zmienia również kolor tekstu menu rozwijanego wyświetlanego, gdy nastąpi przepełnienie przycisków ActionBar. Masz pomysł, jak zmienić kolor menu rozwijanego / Listy?


właśnie opublikowałem rozwiązanie, które działało dla mnie. patrz tutaj stackoverflow.com/a/16175220/627827
spaceMonkey

Odpowiedzi:


447

Ok, znalazłem lepszy sposób. Teraz mogę zmienić tylko kolor tytułu. Możesz także dostosować napisy.

Oto mój styles.xml:

<?xml version="1.0" encoding="utf-8"?>
<resources>
  <style name="MyTheme" parent="@android:style/Theme.Holo.Light">
    <item name="android:actionBarStyle">@style/MyTheme.ActionBarStyle</item>
  </style>

  <style name="MyTheme.ActionBarStyle" parent="@android:style/Widget.Holo.Light.ActionBar">
    <item name="android:titleTextStyle">@style/MyTheme.ActionBar.TitleTextStyle</item>
  </style>

  <style name="MyTheme.ActionBar.TitleTextStyle" parent="@android:style/TextAppearance.Holo.Widget.ActionBar.Title">
    <item name="android:textColor">@color/red</item>
  </style>
</resources>

32
To jest właściwy sposób. Jednak dla zachowania spójności powinieneś dziedziczyć po Widget.Holo.Light.ActionBarfor MyTheme.ActionBarStyle.
Jake Wharton

7
Nie da się zbudować - ADT narzeka, że ​​wymaga wersji 13 lub nowszej (więc ... nie będzie działać na większości telefonów z Androidem :()
Adam

8
@Adam Miałem ten sam problem, ale następna odpowiedź działa dla mnie - zamiast rodzica = "@ android: style / TextAppearance.Holo.Widget.ActionBar.Title" użyj rodzica = "@ android: style / TextAppearance"
bkurzius

8
Jeśli używasz biblioteki Appcompat, zamień Holo na AppCompat. Działa
sha

3
@LOG_TAG Użyj Widget.AppCompat.Light.ActionBar
sha

97

Znalazłem sposób, który działa dobrze z dowolnym smakiem ActionBar( Sherlock , Compat i Native ):

Wystarczy użyć html, aby ustawić tytuł i określić kolor tekstu. Na przykład, aby ustawić kolor tekstu ActionBar na czerwony, po prostu wykonaj następujące czynności:

getActionBar()/* or getSupportActionBar() */.setTitle(Html.fromHtml("<font color=\"red\">" + getString(R.string.app_name) + "</font>"));

Możesz również użyć czerwonego kodu szesnastkowego #FF0000zamiast słowa red. Jeśli masz z tym problem, zobacz Android Html.fromHtml (String) nie działa dla <font color = '#'> text </font> .


Ponadto, jeśli chcesz użyć zasobu kolorów, można użyć tego kodu, aby uzyskać poprawny ciąg HEX i usunąć alfę w razie potrzeby ( znacznik czcionki nie obsługuje alfa):

int orange = getResources().getColor(R.color.orange);
String htmlColor = String.format(Locale.US, "#%06X", (0xFFFFFF & Color.argb(0, Color.red(orange), Color.green(orange), Color.blue(orange))));

Daje to błąd, ponieważ musisz wstawić ciąg znaków do metody Html.fromHtml () i umieszczasz w niej wiele parametrów. Zastąpienie „,” przez „+” działa idealnie :-).
pinyin_samu

3
Po dziesięcioleciach poszukiwań jest to najłatwiejsze rozwiązanie! Dobra robota!
bmkay,

2
@MSI, można użyć wartości hex też po prostu zastąpić redz " + color + ".
Phil

1
@MSI, czy możesz wypróbować to, co sugeruje ten post (zaktualizowałem również moje pytanie)? Wystarczy wymienić #FF0000z "+color+".
Phil

1
Dziękuję Phil. Działa idealnie! Próbowałem w ten sposób: getSupportActionBar (). SetTitle (Html.fromHtml ("<font color = '" + color + "'>" + "Home" + "</font>")); Wystarczy użyć „zamiast \.
MSIslam

93

Miałem ten sam problem co ty, to motyw Holo.Light, ale chciałem stylizować kolor ActionBar, więc musiałem również zmienić kolor tekstu, a także tytuł i menu. Więc na koniec poszedłem do git hub i spojrzałem na kod źródłowy, aż znalazłem cholernie poprawny styl:

<?xml version="1.0" encoding="utf-8"?>
<!-- For honeycomb and up -->
<resources>

    <style name="myTheme" parent="@android:style/Theme.Holo.Light">
        <item name="android:actionBarStyle">@style/myTheme.ActionBar</item>
        <item name="android:actionMenuTextColor">@color/actionBarText</item>
    </style>

    <style name="myTheme.ActionBar" parent="@android:style/Widget.Holo.Light.ActionBar">
        <item name="android:background">@drawable/actionbarbground</item>
        <item name="android:titleTextStyle">@style/myTheme.ActionBar.Text</item>
    </style>

    <style name="myTheme.ActionBar.Text" parent="@android:style/TextAppearance">
        <item name="android:textColor">@color/actionBarText</item>
    </style>

</resources>

więc teraz wszystko, co musisz zrobić, to ustawić cokolwiek @color/actionBarTexti @drawable/actionbarbgroundchcesz!


Gdzie muszę użyć tego xml? wartości lub wartości-v11 lub wartości v-14 ??
DroidLearner

odpowiedź pochodzi z lutego 2012, nie było wtedy V14. Więc na pewno V11.
Budius

poniżej 3.0 system nie ma paska akcji.
Budius

Korzystam z paska akcji Sherlock i znalazłem rozwiązanie. Dzięki :)
DroidLearner

3
w przypadku sherlocka paska akcji musisz użyć konkretnych nazw paska akcji i możesz użyć tego generatora: jgilfelt.github.com/android-actionbarstylegenerator Zawsze używamy go tam, gdzie pracuję. To bardzo dobrze
Budius

67

Identyfikator ActionBar nie jest dostępny bezpośrednio, więc musisz trochę hakować tutaj.

int actionBarTitleId = Resources.getSystem().getIdentifier("action_bar_title", "id", "android");
if (actionBarTitleId > 0) {
    TextView title = (TextView) findViewById(actionBarTitleId);
    if (title != null) {
        title.setTextColor(Color.RED);
    }
}

1
NullPointerExceptionna tej liniiactionBarTextView.setTextColor(Color.RED);
DroidLearner

3
Jeśli używasz interfejsu API na poziomie <11, ActionBarSherlock i chcesz zaoszczędzić sobie drogiego połączenia getIndentifier(), możesz (TextView) findViewById(com.actionbarsherlock.R.id.abs__action_bar_title);najpierw zajrzeć do niego (sprawdź, czy nie jest to wartość zerowa).
Andre

„Identyfikator ActionBar nie jest dostępny bezpośrednio” w rzeczywistości w moim przypadku pasek narzędzi jest łatwo dostępny, tak jak Toolbar toolbar = findViewById(R.id.toolbar);gdzie w pliku układu xml jest on otoczony com.google.android.material.appbar.AppBarLayoutelementem, a następnietoolbar.setTitleTextColor( getResources().getColor( R.color.colorViolet ) );
YoussefDir

32

To stary temat, ale dla przyszłych czytelników korzystanie z paska narzędzi sprawia, że ​​wszystko jest bardzo łatwe:

Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
toolbar.setTitle(R.string.app_name);
toolbar.setTitleTextColor(getResources().getColor(R.color.someColor));
setSupportActionBar(toolbar);


28

Dodaj go do katalogu głównego paska akcji. Miałem ten problem.

<style name="ActionBar" parent="@style/Theme.AppCompat.Light">
    <item name="actionBarStyle">@style/Widget.Styled.ActionBar</item>
    <item name="actionMenuTextColor">@color/stdDarkBlueText</item>
</style>

<style name="Widget.Styled.ActionBar" parent="@style/Widget.AppCompat.Light.ActionBar">
    <item name="titleTextStyle">@style/ActionBarTitleText</item>
    <item name="subtitleTextStyle">@style/ActionBarSubTitleText</item>
</style>

<style name="ActionBarTitleText" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
    <item name="android:textColor">@color/stdDarkBlueText</item>
    <item name="android:textSize">12sp</item>
</style>

<style name="ActionBarSubTitleText" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Subtitle">
    <item name="android:textColor">@color/stdDarkBlueText</item>
    <item name="android:textSize">12sp</item>
</style>

actionMenuTextColor - zmienia kolor tekstu na pasku akcji, nigdy nie działał, gdy był częścią Widget.Styled.ActionBar, więc musiałem dodać go do katalogu głównego. Pozostałe 2 atrybuty zmieniają tytuł i podtytuł paska akcji.


Użyj „android: actionMenuTextColor” zamiast „actionMenuTextColor”. :)
AnkitRox

20

Ustawienie ciągu HTML na pasku akcji nie działa w kompozycji Material w SDK v21 +

Jeśli chcesz to zmienić, ustaw podstawowy kolor tekstu w pliku style.xml

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="android:Theme.Material.Light">
        <!-- Customize your theme here. -->
        <item name="android:textColorPrimary">@color/actionbar-text-color</item>
    </style>
</resources>    

1
To zmienia podstawowy kolor tekstu w aplikacji!
Mohammed,

16

Najprostszym sposobem jest zrobienie tego w pliku styles.xml.

Szablon Google styles.xml obecnie generuje następujące elementy:

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

Jeśli dodasz jeszcze jedną linię przed tagiem zamykającym, jak pokazano, to zmieni kolor tekstu na taki, jaki powinien być z Dark ActionBar:

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

Jeśli chcesz dostosować kolor do czegoś innego, możesz określić własny kolor w colors.xml lub nawet użyć wbudowanego koloru z Androida, używając atrybutu android: textColorPrimary:

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


<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="android:textColorPrimary">@android:color/darker_gray</item>
</style>

Uwaga: Zmienia to kolor tytułu, a także tytuły dowolnych elementów menu wyświetlanych na pasku ActionBar.


12

Jeśli chcesz też stylizować napisy, dodaj je w swoim własnym stylu.

<item name="android:subtitleTextStyle">@style/MyTheme.ActionBar.TitleTextStyle</item>

Ludzie, którzy chcą uzyskać taki sam wynik dla AppCompatbiblioteki, to właśnie tego użyłem:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="CustomActivityTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
        <item name="android:actionBarStyle">@style/MyActionBar</item>
        <item name="actionBarStyle">@style/MyActionBar</item>
        <!-- other activity and action bar styles here -->
    </style>

    <!-- style for the action bar backgrounds -->
    <style name="MyActionBar" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="android:background">@drawable/actionbar_background</item>
        <item name="background">@drawable/actionbar_background</item>
        <item name="android:titleTextStyle">@style/MyTheme.ActionBar.TitleTextStyle</item>
        <item name="android:subtitleTextStyle">@style/MyTheme.ActionBar.TitleTextStyle</item>
        <item name="titleTextStyle">@style/MyTheme.ActionBar.TitleTextStyle</item>
        <item name="subtitleTextStyle">@style/MyTheme.ActionBar.TitleTextStyle</item>
     </style>
    <style name="MyTheme.ActionBar.TitleTextStyle" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
        <item name="android:textColor">@color/color_title</item>
      </style>
</resources>

Próbuję uzyskać jasny motyw, ciemny pasek akcji i biały tekst. Twój kod jest jedyną rzeczą, jaką do tej pory znalazłem, która ma jakikolwiek efekt, ale zmienia cały pasek akcji na biały. Masz pomysł, co się dzieje? Tak, wiem, że to półtora roku. :-)
nasch

To pomogło mi rozwiązać mój problem. Musiałem tylko dodać oba, <item name="android:titleTextStyle"> a <item name="titleTextStyle"> ponieważ korzystałem z biblioteki obsługi aplikacji appcompat.
Rock Lee,

tytuł
zniknie

8

Znalazłem sposób, aby to zrobić ładnie, bez tworzenia własnego układu interfejsu API> = 21.

Koloruje tylko teksty i kontroluje rysunki wewnątrz paska akcji.

Mam nadzieję, że przyda się komuś.

<!--Material design primary colors-->
<style name="AppBaseTheme" parent="Theme.AppCompat.Light">
    <item name="colorPrimary">@color/primary</item>
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <item name="colorAccent">@color/accent</item>
    <item name="android:navigationBarColor">@color/primary_dark</item>
    <item name="actionBarTheme">@style/AppBaseTheme.Toolbar</item>
</style>

<!--Action bar-->
<style name="AppBaseTheme.Toolbar" parent="Widget.AppCompat.ActionBar.Solid">
    <item name="android:textColorPrimary">@color/action_bar_text</item>
    <item name="colorControlNormal">@color/action_bar_text</item>
</style>

7

Wiele odpowiedzi jest nieaktualnych, więc zaktualizuję wątek i pokażę, jak zmienić kolor tekstu i kolor tła w ActionBar (pasku narzędzi) oraz w wyskakującym menu ActionBar.

Najnowsze podejście w Androidzie (od maja 2018 r.) W pracy z paskiem akcji (pasek narzędzi) polega na użyciu motywu z NoActionBar i zamiast tego na pasku narzędzi.

oto czego potrzebujesz:

  1. W działaniu (który rozszerza AppCompatActivity) zadeklaruj pasek narzędzi:

    Toolbar myToolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(myToolbar);
  2. Dodaj pasek narzędzi w układzie xml działania. Tutaj ustawimy niestandardowe (nadpisane motywy), notatkę android:theme="@style/ThemeOverlay.AppTheme.ActionBar"iapp:popupTheme="@style/ThemeOverlay.AppTheme.PopupMenu" , zrobią to samo.

    <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:minHeight="?attr/actionBarSize"
    android:theme="@style/ThemeOverlay.AppTheme.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppTheme.PopupMenu"
    app:layout_constraintTop_toTopOf="parent" />
  3. W pliku styles.xml musisz zastąpić te dwa style, aby ustawić niestandardowe kolory:

    <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>
    <item name="actionBarTheme">@style/ThemeOverlay.AppTheme.ActionBar</item>
    <item name="actionBarPopupTheme">@style/ThemeOverlay.AppTheme.PopupMenu</item>
    </style>
    
    <style name="ThemeOverlay.AppTheme.ActionBar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="android:textColorPrimary">@color/action_bar_text_color</item>
    <item name="android:background">@color/action_bar_bg_color</item>
    </style>
    
    <style name="ThemeOverlay.AppTheme.PopupMenu" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="android:background">@color/popup_bg_color</item>
    <item name="android:textColorPrimary">@color/popup_text_color</item>
    </style>

To wszystko ludzie

ps, jeśli mnie zapytasz, powiedziałbym: TAK, cała ta sprawa jest cholernie nieładna.


5

To jest rozwiązanie, którego użyłem po sprawdzeniu wszystkich odpowiedzi

<!-- Base application theme. -->
<style name="AppTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorAccent">@color/Button_color</item>
    <item name="android:editTextStyle">@style/EditTextStyle</item>
    <item name="android:typeface">monospace</item>
    <item name="android:windowActionBar">true</item>
    <item name="colorPrimary">@color/Title_Bar_Color</item>
    <item name="android:actionBarStyle">@style/Widget.Styled.ActionBar</item>
    <item name="actionBarStyle">@style/Widget.Styled.ActionBar</item>

</style>

<style name="EditTextStyle" parent="Widget.AppCompat.EditText"/>

<style name="Widget.Styled.ActionBar" parent="@style/Widget.AppCompat.Light.ActionBar">
    <item name="titleTextStyle">@style/ActionBarTitleText</item>
    <item name="android:background">@color/Title_Bar_Color</item>
    <item name="background">@color/Title_Bar_Color</item>
    <item name="subtitleTextStyle">@style/ActionBarSubTitleText</item>
</style>

<style name="ActionBarTitleText" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
    <item name="android:textColor">@color/solid_white</item>
    <item name="android:textSize">12sp</item>
</style>

<style name="ActionBarSubTitleText" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Subtitle">
    <item name="android:textColor">@color/solid_white</item>
    <item name="android:textSize">12sp</item>
</style>

Zmień wymagane kolory, które będą działać


4

Ta funkcja działa dobrze

private void setActionbarTextColor(ActionBar actBar, int color) {

    String title = actBar.getTitle().toString();
    Spannable spannablerTitle = new SpannableString(title);
    spannablerTitle.setSpan(new ForegroundColorSpan(color), 0, spannablerTitle.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
    actBar.setTitle(spannablerTitle);

}

następnie, aby go użyć, po prostu podaj mu pasek akcji i nowy kolor, tj

ActionBar actionBar = getActionBar();    // Or getSupportActionBar() if using appCompat
int red = Color.RED
setActionbarTextColor(actionBar, red);

4

Spróbuj dodać to w swoim działaniu onCreate. Działa na prawie każdej wersji Androida.

 actionBar.setTitle(Html.fromHtml("<font color='#ffff00'>Your Title</font>"));  

lub

getSupportActionBar().setTitle(Html.fromHtml("<font color='#ffff00'>Your Title</font>"));

Powinieneś umieścić taki ciąg: String coloredTitle = "<font color = '# FFFFFF'>" + Your_Title + "</font>"; Html.fromHtml (coloredTitle);
Tincho825

2

Wypróbuj wiele metod, w niskiej wersji API, wykonalną metodą jest <item name="actionMenuTextColor">@color/your_color</item>i nie używaj przestrzeni nazw Androida, mam nadzieję, że może ci pomóc

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>
    <item name="actionMenuTextColor">@color/actionMenuTextColor</item>
</style>

1

po prostu włóż to do swojego stylu.

<item name="android:textColorPrimary">@color/yourcolor</item>



0

To nie jest zalecane rozwiązanie, ponieważ przechodzę tutaj w Android api, ale ponieważ moja aplikacja wymaga dynamicznej zmiany motywu na warunkach xml tutaj niemożliwych, więc muszę to zrobić. Ale to rozwiązanie działa bardzo dobrze.

Rozwiązanie:--

 /**
 * 
 * @author Kailash Dabhi
 * @email kailash09dabhi@gmail.com
 *
 */ 
 public static void setActionbarTextColor(Activity activity, int color) {
    Field mActionViewField;
    try {
        mActionViewField = activity.getActionBar().getClass()
                .getDeclaredField("mActionView");
        mActionViewField.setAccessible(true);
        Object mActionViewObj = mActionViewField.get(activity
                .getActionBar());

        Field mTitleViewField = mActionViewObj.getClass().getDeclaredField(
                "mTitleView");
        mTitleViewField.setAccessible(true);
        Object mTitleViewObj = mTitleViewField.get(mActionViewObj);

        TextView mActionBarTitle = (TextView) mTitleViewObj;
        mActionBarTitle.setTextColor(color);
        // Log.i("field", mActionViewObj.getClass().getName());
    } catch (NoSuchFieldException e) {
        e.printStackTrace();
    } catch (IllegalAccessException e) {
        e.printStackTrace();
    } catch (IllegalArgumentException e) {
        e.printStackTrace();
    }

}

0

W przypadku Androida 5 (Lollipop) będziesz musiał użyć Androida: actionBarPopupTheme, aby ustawić textColor dla menu przepełnienia.


0

Najprostszym sposobem jest:
Dodaj te dwie linie do pliku styles.xml

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
...
<item name="android:textColorSecondary">@color/white</item>
<item name="android:textColor">@color/white</item>
</style>

Zastąp kolor swoim kolorem.


-1

możesz zmienić kolor dowolnego tekstu za pomocą atrybutu HTML<font> bezpośrednio w xmlplikach. na przykład w strings.xml:

<resources>
    <string name = "app_name">
        <html><font color="#001aff">Multi</font></html>
        <html><font color="#ff0044">color</font></html>
        <html><font color="#e9c309">Text </font></html>
    </string>
</resources>

wprowadź opis zdjęcia tutaj

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.