Я тестирую новые функции Appcompat 21 Material Design. Поэтому я создал такую панель инструментов:
<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/activity_my_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:theme="@style/ThemeOverlay.AppCompat.ActionBar"/>
и включил его в свой основной файл макета.
Затем я установил его как supportActionBar следующим образом:
Toolbar toolBar = (Toolbar)findViewById(R.id.activity_my_toolbar);
setSupportActionBar(toolBar);
Он работает, но почему-то я не могу понять, как настроить панель инструментов. Он серый, а текст на нем черный. Как мне изменить цвет фона и текста?
Я выполнил эти инструкции:
http://android-developers.blogspot.de/2014/10/appcompat-v21-material-design-for-pre.html
Что я наблюдал, чтобы изменить цвета?
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="android:windowActionBar" tools:ignore="NewApi">false</item>
<item name="windowActionBar">false</item>
</style>
ИЗМЕНИТЬ :
Мне удалось изменить цвет фона, добавив в тему следующие строки кода:
<item name="colorPrimary">@color/actionbar</item>
<item name="colorPrimaryDark">@color/actionbar_dark</item>
Но они не повлияют на цвет текста. Что мне не хватает? Вместо черного текста и черной кнопки меню я бы предпочел белый текст и белые кнопки меню:
Ответы:
снова это все в указанной вами ссылке
чтобы изменить текст на белый, все, что вам нужно сделать, это изменить тему.
использовать эту тему
<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/activity_my_toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:minHeight="?attr/actionBarSize" android:background="?attr/colorPrimary" app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
источник
AppCompatActivity
вместоActivity
.ОБНОВЛЕНИЕ 12/11/2019: Библиотека компонентов материалов
С помощью библиотек компонентов материала и Androidx вы можете использовать:
android:background
атрибут в макете:<com.google.android.material.appbar.MaterialToolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="?attr/colorPrimary"
применить стиль по умолчанию:
style="@style/Widget.MaterialComponents.Toolbar.Primary"
или настроить стиль, унаследованный от него:<com.google.android.material.appbar.MaterialToolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" style="@style/Widget.MaterialComponents.Toolbar.Primary"
переопределить цвет по умолчанию с помощью
android:theme
атрибута:<com.google.android.material.appbar.MaterialToolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:theme="@style/MyThemeOverlay_Toolbar"
с участием:
<style name="MyThemeOverlay_Toolbar" parent="ThemeOverlay.MaterialComponents.Toolbar.Primary"> <item name="android:textColorPrimary">....</item> <item name="colorPrimary">@color/..... <item name="colorOnPrimary">@color/....</item> </style>
СТАРОЕ: библиотеки поддержки:
вы можете использовать
app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
тему, как предложено в других ответах, но вы также можете использовать такое решение:<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" style="@style/HeaderBar" app:theme="@style/ActionBarThemeOverlay" app:popupTheme="@style/ActionBarPopupThemeOverlay"/>
И вы можете полностью контролировать элементы пользовательского интерфейса с помощью следующих стилей:
<style name="ActionBarThemeOverlay" parent=""> <item name="android:textColorPrimary">#fff</item> <item name="colorControlNormal">#fff</item> <item name="colorControlHighlight">#3fff</item> </style> <style name="HeaderBar"> <item name="android:background">?colorPrimary</item> </style> <style name="ActionBarPopupThemeOverlay" parent="ThemeOverlay.AppCompat.Light" > <item name="android:background">@android:color/white</item> <item name="android:textColor">#000</item> </style>
источник
Привет, если вы хотите применить тему материала только для Android 5.0, вы можете добавить в нее эту тему
<style name="AppHomeTheme" parent="@android:style/Theme.Material.Light"> <!-- customize the color palette --> <item name="android:colorPrimary">@color/blue_dark_bg</item> <item name="android:colorPrimaryDark">@color/blue_status_bar</item> <item name="android:colorAccent">@color/blue_color_accent</item> <item name="android:textColor">@android:color/white</item> <item name="android:textColorPrimary">@android:color/white</item> <item name="android:actionMenuTextColor">@android:color/black</item> </style>
Здесь ниже строка отвечает за цвет текста панели действий материального дизайна.
<item name="android:textColorPrimary">@android:color/white</item>
источник
Вы можете настроить цвет элемента пользовательской панели инструментов динамически, создав собственный класс панели инструментов:
package view; import android.app.Activity; import android.content.Context; import android.graphics.ColorFilter; import android.graphics.PorterDuff; import android.graphics.PorterDuffColorFilter; import android.support.v7.internal.view.menu.ActionMenuItemView; import android.support.v7.widget.ActionMenuView; import android.support.v7.widget.Toolbar; import android.util.AttributeSet; import android.util.Log; import android.view.View; import android.view.ViewGroup; import android.widget.AutoCompleteTextView; import android.widget.EditText; import android.widget.ImageButton; import android.widget.ImageView; import android.widget.TextView; public class CustomToolbar extends Toolbar{ public CustomToolbar(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); // TODO Auto-generated constructor stub } public CustomToolbar(Context context, AttributeSet attrs) { super(context, attrs); // TODO Auto-generated constructor stub } public CustomToolbar(Context context) { super(context); // TODO Auto-generated constructor stub ctxt = context; } int itemColor; Context ctxt; @Override protected void onLayout(boolean changed, int l, int t, int r, int b) { Log.d("LL", "onLayout"); super.onLayout(changed, l, t, r, b); colorizeToolbar(this, itemColor, (Activity) ctxt); } public void setItemColor(int color){ itemColor = color; colorizeToolbar(this, itemColor, (Activity) ctxt); } /** * Use this method to colorize toolbar icons to the desired target color * @param toolbarView toolbar view being colored * @param toolbarIconsColor the target color of toolbar icons * @param activity reference to activity needed to register observers */ public static void colorizeToolbar(Toolbar toolbarView, int toolbarIconsColor, Activity activity) { final PorterDuffColorFilter colorFilter = new PorterDuffColorFilter(toolbarIconsColor, PorterDuff.Mode.SRC_IN); for(int i = 0; i < toolbarView.getChildCount(); i++) { final View v = toolbarView.getChildAt(i); doColorizing(v, colorFilter, toolbarIconsColor); } //Step 3: Changing the color of title and subtitle. toolbarView.setTitleTextColor(toolbarIconsColor); toolbarView.setSubtitleTextColor(toolbarIconsColor); } public static void doColorizing(View v, final ColorFilter colorFilter, int toolbarIconsColor){ if(v instanceof ImageButton) { ((ImageButton)v).getDrawable().setAlpha(255); ((ImageButton)v).getDrawable().setColorFilter(colorFilter); } if(v instanceof ImageView) { ((ImageView)v).getDrawable().setAlpha(255); ((ImageView)v).getDrawable().setColorFilter(colorFilter); } if(v instanceof AutoCompleteTextView) { ((AutoCompleteTextView)v).setTextColor(toolbarIconsColor); } if(v instanceof TextView) { ((TextView)v).setTextColor(toolbarIconsColor); } if(v instanceof EditText) { ((EditText)v).setTextColor(toolbarIconsColor); } if (v instanceof ViewGroup){ for (int lli =0; lli< ((ViewGroup)v).getChildCount(); lli ++){ doColorizing(((ViewGroup)v).getChildAt(lli), colorFilter, toolbarIconsColor); } } if(v instanceof ActionMenuView) { for(int j = 0; j < ((ActionMenuView)v).getChildCount(); j++) { //Step 2: Changing the color of any ActionMenuViews - icons that //are not back button, nor text, nor overflow menu icon. final View innerView = ((ActionMenuView)v).getChildAt(j); if(innerView instanceof ActionMenuItemView) { int drawablesCount = ((ActionMenuItemView)innerView).getCompoundDrawables().length; for(int k = 0; k < drawablesCount; k++) { if(((ActionMenuItemView)innerView).getCompoundDrawables()[k] != null) { final int finalK = k; //Important to set the color filter in seperate thread, //by adding it to the message queue //Won't work otherwise. //Works fine for my case but needs more testing ((ActionMenuItemView) innerView).getCompoundDrawables()[finalK].setColorFilter(colorFilter); // innerView.post(new Runnable() { // @Override // public void run() { // ((ActionMenuItemView) innerView).getCompoundDrawables()[finalK].setColorFilter(colorFilter); // } // }); } } } } } } }
затем обратитесь к нему в своем файле макета. Теперь вы можете установить собственный цвет, используя
toolbar.setItemColor(Color.Red);
Источники:
Я нашел информацию для этого здесь: Как динамически изменять цвет значков панели инструментов Android
а затем я отредактировал его, улучшил и разместил здесь: GitHub: AndroidDynamicToolbarItemColor
источник
Это то, что известно как DarkActionBar, что означает, что вы должны использовать следующую тему для получения желаемого стиля:
<android.support.v7.widget.Toolbar android:layout_height="wrap_content" android:layout_width="match_parent" android:minHeight="@dimen/triple_height_toolbar" app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
источник
Вы можете изменить цвет текста на панели инструментов:
<item name="android:textColorPrimary">#FFFFFF</item> <item name="android:textColor">#FFFFFF</item>
источник
Достичь этого можно
toolbar
следующим образом:<android.support.v7.widget.Toolbar android:id="@+id/base_toolbar" android:layout_height="wrap_content" android:layout_width="match_parent" android:minHeight="?attr/actionBarSize" android:background="@color/colorPrimary" app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
источник
Попробуйте это в своем файле styles.xml:
colorPrimary будет цветом панели инструментов.
<resources> <style name="AppTheme" parent="Theme.AppCompat"> <item name="colorPrimary">@color/primary</item> <item name="colorPrimaryDark">@color/primary_pressed</item> <item name="colorAccent">@color/accent</item> </style>
Кстати, вы построили это в Eclipse?
источник
Я решил эту проблему после дополнительного изучения ...
для Api21 и других используйте
<item name="android:textColorPrimary">@color/white</item>
для более низких версий используйте
<item name="actionMenuTextColor">@color/white</item>
источник
Если вы хотите изменить цвет панели инструментов во всем приложении, используйте файл styles.xml. В общем, я избегаю изменения компонентов пользовательского интерфейса в своем Java-коде, если я не пытаюсь сделать что-то программно. Если это одноразовый набор, то вы должны сделать это в xml, чтобы ваш код был чище. Вот как будет выглядеть ваш файл styles.xml:
<!-- Base application theme. --> <style name="YourAppName.AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> <!-- Color Primary will be your toolbar color --> <item name="colorPrimary">@color/colorPrimary</item> <!-- Color Primary Dark will be your default status bar color --> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> </style>
Убедитесь, что вы используете указанный выше стиль в своем AndroidManifext.xml как таковой:
<application android:theme="@style/YourAppName.AppTheme"> </application>
Мне нужны разные цвета панели инструментов для разных действий. Итак, я снова использовал такие стили:
<style name="YourAppName.AppTheme.Activity1"> <item name="colorPrimary">@color/activity1_primary</item> <item name="colorPrimaryDark">@color/activity1_primaryDark</item> </style> <style name="YourAppName.AppTheme.Activity2"> <item name="colorPrimary">@color/activity2_primary</item> <item name="colorPrimaryDark">@color/activity2_primaryDark</item> </style>
опять же, примените стили к каждому действию в вашем AndroidManifest.xml как таковом:
<activity android:name=".Activity2" android:theme="@style/YourAppName.AppTheme.Activity2" </activity> <activity android:name=".Activity1" android:theme="@style/YourAppName.AppTheme.Activity1" </activity>
источник
Для людей, которые используют AppCompatActivity с панелью инструментов в качестве белого фона. Используйте этот код.
Обновлено: декабрь 2017 г.
<android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content" app:theme="@style/ThemeOverlay.AppCompat.Light"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar_edit" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" app:popupTheme="@style/AppTheme.AppBarOverlay" app:title="Edit Your Profile"/> </android.support.design.widget.AppBarLayout>
источник