Как установить цвет заголовка для новой панели инструментов?
Я использую новую панель инструментов V7, и для жизни меня невозможно понять, как изменить цвет названия. Я установил @style панели инструментов в стиль, объявленный в styles.xml, и применил titleTextStyle с textColor. Я что-то упускаю? Я кодирую Lollipop, но тестирую в настоящее время на устройстве Kitkat.
styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="@style/Theme.AppCompat.Light">
<item name="android:windowNoTitle">true</item>
<item name="windowActionBar">false</item>
</style>
<style name="ActionBar" parent="Theme.AppCompat">
<item name="android:background">@color/actionbar_background</item>
<item name="android:titleTextStyle">@style/ActionBar.TitleTextStyle</item>
</style>
<style name="ActionBar.TitleTextStyle" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
<item name="android:textColor">@color/actionbar_title_text</item>
</style>
</resources>
actionbar.xml:
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/toolbar_actionbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
style="@style/ActionBar"/>
Ответы
Ответ 1
Вариант 1) Быстрый и простой способ (только панель инструментов)
Так как appcompat-v7-r23 вы можете использовать следующие атрибуты непосредственно на вашем Toolbar
или его стиле:
app:titleTextColor="@color/primary_text"
app:subtitleTextColor="@color/secondary_text"
Если ваш минимальный SDK равен 23 и вы используете native Toolbar
, просто измените префикс пространства имен на android
.
В Java вы можете использовать следующие методы:
toolbar.setTitleTextColor(Color.WHITE);
toolbar.setSubtitleTextColor(Color.WHITE);
Эти методы принимают цвет int не идентификатор ресурса цвета!
Вариант 2) Переопределить стиль и атрибуты панели инструментов
Макет /xxx.xml
<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="wrap_content"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.MyApp.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
style="@style/Widget.MyApp.Toolbar.Solid"/>
значения /styles.xml
<style name="Widget.MyApp.Toolbar.Solid" parent="Widget.AppCompat.ActionBar">
<item name="android:background">@color/actionbar_color</item>
<item name="android:elevation" tools:ignore="NewApi">4dp</item>
<item name="titleTextAppearance">...</item>
</style>
<style name="ThemeOverlay.MyApp.ActionBar" parent="ThemeOverlay.AppCompat.ActionBar">
<!-- Parent theme sets colorControlNormal to textColorPrimary. -->
<item name="android:textColorPrimary">@color/actionbar_title_text</item>
</style>
Помогите! Мои значки тоже изменили цвет!
@PeterKnut сообщила, что это влияет на цвет кнопки переполнения, кнопки навигационного ящика и кнопки возврата. Он также меняет цвет текста SearchView
.
Что касается цветов значков: colorControlNormal
наследует от
-
android:textColorPrimary
для темных тем (белый на черном)
-
android:textColorSecondary
для светлых тем (черный на белом)
Если вы примените это к теме панели действий, вы можете настроить цвет значка.
<item name="colorControlNormal">#de000000</item>
В appcompat-v7 произошла ошибка с r23, которая потребовала, чтобы вы также переопределили родной экземпляр следующим образом:
<item name="android:colorControlNormal" tools:ignore="NewApi">?colorControlNormal</item>
Помогите! Мой SearchView - беспорядок!
Примечание. Этот раздел, возможно, устарел.
Поскольку вы используете виджет поиска, который по какой-то причине использует другую стрелку назад (не визуально, технически), чем та, которая включена в appcompat-v7, вы должны установить ее вручную в теме приложения. Поддерживаемые библиотеки поддержки корректно окрашиваются. В противном случае он всегда будет белым.
<item name="homeAsUpIndicator">@drawable/abc_ic_ab_back_mtrl_am_alpha</item>
Что касается текста вида поиска... нет простого способа. После копания через его источник я нашел способ добраться до текстового представления. Я не проверял это, поэтому, пожалуйста, дайте мне знать в комментариях, если это не сработает.
SearchView sv = ...; // get your search view instance in onCreateOptionsMenu
// prefix identifier with "android:" if you're using native SearchView
TextView tv = sv.findViewById(getResources().getIdentifier("id/search_src_text", null, null));
tv.setTextColor(Color.GREEN); // and of course specify your own color
Бонус: переопределить атрибуты стиля и стиля ActionBar
Соответствующий стиль для панели действий appcompat-v7 по умолчанию будет выглядеть так:
<!-- ActionBar vs Toolbar. -->
<style name="Widget.MyApp.ActionBar.Solid" parent="Widget.AppCompat.ActionBar.Solid">
<item name="background">@color/actionbar_color</item> <!-- No prefix. -->
<item name="elevation">4dp</item> <!-- No prefix. -->
<item name="titleTextStyle">...</item> <!-- Style vs appearance. -->
</style>
<style name="Theme.MyApp" parent="Theme.AppCompat">
<item name="actionBarStyle">@style/Widget.MyApp.ActionBar.Solid</item>
<item name="actionBarTheme">@style/ThemeOverlay.MyApp.ActionBar</item>
<item name="actionBarPopupTheme">@style/ThemeOverlay.AppCompat.Light</item>
</style>
Ответ 2
Вот мое решение, если вам нужно изменить только цвет заголовка, а не цвет текста в виджетах поиска.
макет /toolbar.xml
<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:background="@color/toolbar_bg"
app:theme="@style/AppTheme.Toolbar"
app:titleTextAppearance="@style/AppTheme.Toolbar.Title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"/>
<сильные > значения /themes.xml
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
</style>
<style name="AppTheme.Toolbar" parent="ThemeOverlay.AppCompat.ActionBar">
<!-- Customize color of navigation drawer icon and back arrow -->
<item name="colorControlNormal">@color/toolbar_icon</item>
</style>
<style name="AppTheme.Toolbar.Title" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
<!-- Set proper title size -->
<item name="android:textSize">@dimen/abc_text_size_title_material_toolbar</item>
<!-- Set title color -->
<item name="android:textColor">@color/toolbar_title</item>
</style>
</resources>
Аналогичным образом вы также можете установить subtitleTextAppearance.
Ответ 3
Если вы поддерживаете API 23 и выше, теперь вы можете использовать атрибут titleTextColor для установки цвета заголовка панели инструментов.
макет /toolbar.xml
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:titleTextColor="@color/colorPrimary"
/>
MyActivity.java
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar)
toolbar.setTitleTextColor(Color.WHITE);
Ответ 4
Настройка app:titleTextColor
на моем android.support.v7.widget.Toolbar
работает для меня на Android 4.4 и 6.0 тоже с com.android.support:appcompat-v7:23.1.0
:
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:titleTextColor="@android:color/white" />
Ответ 5
Это раздражало меня некоторое время, и мне не понравился какой-либо из ответов, поэтому я взглянул на источник, чтобы увидеть, как он работает.
FractalWrench находится на правильном пути, но его можно использовать ниже API 23 и его не нужно устанавливать на панели инструментов.
Как говорили другие, вы можете установить стиль на панели инструментов с помощью
app:theme="@style/ActionBar"
и в этом стиле вы можете установить цвет текста заголовка с помощью
<item name="titleTextColor">#00f</item>
для pre API 23 или для 23 +
<item name="android:titleTextColor">your colour</item>
Полный xml
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:theme="@style/ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Dark"/>
<style name="ActionBar" parent="@style/ThemeOverlay.AppCompat.ActionBar">
<item name="android:titleTextStyle">@style/ActionBarTextStyle</item>
<item name="titleTextColor">your colour</item>
<item name="android:background">#ff9900</item>
</style>
Сохраняет все атрибуты, которые можно установить для панели инструментов
<declare-styleable name="Toolbar">
<attr name="titleTextAppearance" format="reference" />
<attr name="subtitleTextAppearance" format="reference" />
<attr name="title" />
<attr name="subtitle" />
<attr name="gravity" />
<attr name="titleMargins" format="dimension" />
<attr name="titleMarginStart" format="dimension" />
<attr name="titleMarginEnd" format="dimension" />
<attr name="titleMarginTop" format="dimension" />
<attr name="titleMarginBottom" format="dimension" />
<attr name="contentInsetStart" />
<attr name="contentInsetEnd" />
<attr name="contentInsetLeft" />
<attr name="contentInsetRight" />
<attr name="maxButtonHeight" format="dimension" />
<attr name="navigationButtonStyle" format="reference" />
<attr name="buttonGravity">
<!-- Push object to the top of its container, not changing its size. -->
<flag name="top" value="0x30" />
<!-- Push object to the bottom of its container, not changing its size. -->
<flag name="bottom" value="0x50" />
</attr>
<!-- Icon drawable to use for the collapse button. -->
<attr name="collapseIcon" format="reference" />
<!-- Text to set as the content description for the collapse button. -->
<attr name="collapseContentDescription" format="string" />
<!-- Reference to a theme that should be used to inflate popups
shown by widgets in the toolbar. -->
<attr name="popupTheme" format="reference" />
<!-- Icon drawable to use for the navigation button located at
the start of the toolbar. -->
<attr name="navigationIcon" format="reference" />
<!-- Text to set as the content description for the navigation button
located at the start of the toolbar. -->
<attr name="navigationContentDescription" format="string" />
<!-- Drawable to set as the logo that appears at the starting side of
the Toolbar, just after the navigation button. -->
<attr name="logo" />
<!-- A content description string to describe the appearance of the
associated logo image. -->
<attr name="logoDescription" format="string" />
<!-- A color to apply to the title string. -->
<attr name="titleTextColor" format="color" />
<!-- A color to apply to the subtitle string. -->
<attr name="subtitleTextColor" format="color" />
</declare-styleable>
Ответ 6
Самый простой способ изменить цвет заголовка Toolbar
с помощью CollapsingToolbarLayout
.
Добавьте стили ниже в CollapsingToolbarLayout
<android.support.design.widget.CollapsingToolbarLayout
app:collapsedTitleTextAppearance="@style/CollapsedAppBar"
app:expandedTitleTextAppearance="@style/ExpandedAppBar">
styles.xml
<style name="ExpandedAppBar" parent="@android:style/TextAppearance">
<item name="android:textSize">24sp</item>
<item name="android:textColor">@android:color/black</item>
<item name="android:textAppearance">@style/TextAppearance.Lato.Bold</item>
</style>
<style name="CollapsedAppBar" parent="@android:style/TextAppearance">
<item name="android:textColor">@android:color/black</item>
<item name="android:textAppearance">@style/TextAppearance.Lato.Bold</item>
</style>
Ответ 7
Это сработало для меня
<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="wrap_content"
android:background="?attr/colorPrimary"
android:fitsSystemWindows="true"
android:minHeight="?attr/actionBarSize"
app:navigationIcon="@drawable/ic_back"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:subtitleTextColor="@color/white"
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:title="This week stats"
app:titleTextColor="@color/white">
<ImageView
android:id="@+id/submitEditNote"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:layout_marginRight="10dp"
android:src="@android:drawable/ic_menu_manage" />
</android.support.v7.widget.Toolbar>
Ответ 8
Создайте панель инструментов в вашем xml... toolbar.xml:
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
</android.support.v7.widget.Toolbar>
Затем добавьте следующее в ваш toolbar.xml:
app:titleTextColor="@color/colorText"
app:title="@string/app_name">
Remeber @color/colorText - это просто ваш файл color.xml с атрибутом цвета с именем colorText и вашим цветом. Это лучший способ вызывать ваши строки, а не жестко кодировать ваш цвет внутри вашего toolbar.xml. У вас также есть другие варианты для изменения текста, такие как: textAppearance... и т.д.... просто введите app: text... и intelisense предложит вам варианты в Android Studio.
Ваша последняя панель инструментов должна выглядеть так:
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_weight="1"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="@style/Theme.AppCompat"
app:subtitleTextAppearance="@drawable/icon"
app:title="@string/app_name">
</android.support.v7.widget.Toolbar>
Примечание: эта панель инструментов должна находиться внутри вашего activity_main.xml.Easy Peasie
Другой вариант - сделать все это в вашем классе:
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
toolbar.setTitleTextColor(Color.WHITE);
Удачи
Ответ 9
Для изменения Цвет
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:background="?attr/colorPrimary"
/" >
Toolbar myToolbar = (Toolbar) findViewById(R.id.toolbar);
myToolbar.setTitleTextColor(ContextCompat.getColor(getApplicationContext(), R.color.Auth_Background));
setSupportActionBar(myToolbar);
Ответ 10
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:titleTextColor="@color/white"
android:background="@color/green" />
Ответ 11
Если вы можете использовать appcompat-v7 приложение: titleTextColor = "# fff" >
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/colorPrimary"
android:visibility="gone"
app:titleTextColor="#fff">
</android.support.v7.widget.Toolbar>
Ответ 12
public class MyToolbar extends android.support.v7.widget.Toolbar {
public MyToolbar(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
super.onLayout(changed, l, t, r, b);
AppCompatTextView textView = (AppCompatTextView) getChildAt(0);
if (textView!=null) textView.setTextAppearance(getContext(), R.style.TitleStyle);
}
}
Или простое использование от MainActivity:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbarMain);
setSupportActionBar(toolbar);
((AppCompatTextView) toolbar.getChildAt(0)).setTextAppearance(this, R.style.TitleStyle);
style.xml
<style name="TileStyle" parent="TextAppearance.AppCompat">
<item name="android:textColor">@color/White</item>
<item name="android:shadowColor">@color/Black</item>
<item name="android:shadowDx">-1</item>
<item name="android:shadowDy">1</item>
<item name="android:shadowRadius">1</item>
</style>
Ответ 13
Сделайте это с toolbar.setTitleTextAppearance(context, R.style.TitleTextStyle);
//это стиль, в котором вы можете настроить цветовую схему
<style name="TitleTextStyle" parent="@android:style/TextAppearance.Holo.Widget.ActionBar.Title">
<item name="android:fontFamily">@string/you_font_family</item>
<item name="android:textStyle">normal</item>
<item name="android:textAppearance">@style/you_text_style</item>
<item name="android:textColor">#000000</item>
<item name="android:textSize">20sp</item>
</style>
Ответ 14
Очень просто, это сработало для меня (заголовок и иконка белого цвета):
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="@color/PrimaryColor"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
android:elevation="4dp" />