Join FlipAndroid.COM Telegram Group: https://t.me/joinchat/F_aqThGkhwcLzmI49vKAiw


Cambiar el color de la barra de herramientas en Appcompat 21

Estoy probando las nuevas características de diseño de material de Appcompat 21. Por lo tanto he creado una barra de herramientas como esta:

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

Y se incluyó en mi archivo de diseño principal.

Entonces lo he fijado como supportActionBar como eso:

 Toolbar toolBar = (Toolbar)findViewById(R.id.activity_my_toolbar); setSupportActionBar(toolBar); 

Está funcionando, pero de alguna manera no puedo encontrar la forma de personalizar la barra de herramientas. Es gris y el texto en él es negro. ¿Cómo debo cambiar el color del fondo y del texto?

He pasado por estas instrucciones:

Http://android-developers.blogspot.de/2014/10/appcompat-v21-material-design-for-pre.html

¿Qué he supervisado para cambiar los colores?

  <style name="AppTheme" parent="Theme.AppCompat.Light"> <item name="android:windowActionBar" tools:ignore="NewApi">false</item> <item name="windowActionBar">false</item> </style> 

EDIT :

Pude cambiar el color de fondo añadiendo estas líneas de código al tema:

 <item name="colorPrimary">@color/actionbar</item> <item name="colorPrimaryDark">@color/actionbar_dark</item> 

Pero no afectarán el color del texto. ¿Qué me estoy perdiendo? En lugar del botón de menú en negro y en negro, prefiero un botón de menú blanco y texto blanco:

Introduzca aquí la descripción de la imagen

  • Personalización del espaciado de los hiladores
  • Diseño de un Spinner, appcompat, material
  • PopupBackground problemas con el diseño del material
  • Android Spinner Color de subrayado
  • No se puede cambiar el tema Appcompat de luz a holo oscuro
  • Animación ActionBarDrawerToggle
  • Cambiar diseño de material AppCompat ActionBar Color
  • Fondo de estilo AppCompat propagado a la imagen dentro de la barra de herramientas
  • 9 Solutions collect form web for “Cambiar el color de la barra de herramientas en Appcompat 21”

    Nuevamente esto es todo en el enlace que proporcionó

    Para cambiar el texto a blanco todo lo que tienes que hacer es cambiar el tema.

    Utilizar este tema

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

    Puedes usar un app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" como se sugiere en otras respuestas, pero también puedes usar una solución como esta:

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

    Y usted puede tener el control total de sus elementos de ui con estos estilos:

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

    Hola si quieres aplicar tema material para sólo android 5.0, entonces puede agregar este tema en él

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

    Aquí abajo la línea es responsable para el color del texto de la barra de acción del diseño material.

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

    Esto es lo que se conoce como DarkActionBar, lo que significa que debe utilizar el siguiente tema para obtener el estilo deseado:

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

    Puede configurar dinámicamente un color personalizado de la barra de herramientas creando una clase de barra de herramientas personalizada:

     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); // } // }); } } } } } } } 

    A continuación, consulte a él en su archivo de diseño. Ahora puede configurar un color personalizado

     toolbar.setItemColor(Color.Red); 

    Fuentes:

    Encontré la información para hacer esto aquí: Cómo cambiar dinámicamente el color de los iconos de la barra de herramientas de Android

    Y luego lo he editado, mejorado y publicado aquí: GitHub: AndroidDynamicToolbarItemColor

    Puede cambiar el color del texto en la barra de herramientas con estos:

     <item name="android:textColorPrimary">#FFFFFF</item> <item name="android:textColor">#FFFFFF</item> 

    Conseguir esto usando la toolbar como esto:

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

    Prueba esto en tus estilos.xml:

    ColorPrimary será el color de la barra de herramientas.

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

    ¿Construiste esto en Eclipse por cierto?

    Resolví este problema después de más estudio …

    Para Api21 y más uso

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

    Para versiones inferiores use

      <item name="actionMenuTextColor">@color/white</item> 
    FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.