在Appcompat 21中更改工具栏颜色

use*_*644 87 android android-appcompat android-actionbar android-actionbar-compat android-toolbar

我正在测试新的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"/>
Run Code Online (Sandbox Code Playgroud)

并将其包含在我的主布局文件中.

然后我将它设置为supportActionBar:

Toolbar toolBar = (Toolbar)findViewById(R.id.activity_my_toolbar);
setSupportActionBar(toolBar);
Run Code Online (Sandbox Code Playgroud)

它工作,但不知何故,我无法弄清楚如何自定义工具栏.它是灰色的,上面的文字是黑色的.我该如何更改背景和文字颜色?

我已经完成了这个指示:

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>
Run Code Online (Sandbox Code Playgroud)

编辑:

我可以通过在主题中添加以下代码行来更改背景颜色:

<item name="colorPrimary">@color/actionbar</item>
<item name="colorPrimaryDark">@color/actionbar_dark</item>
Run Code Online (Sandbox Code Playgroud)

但它们不会影响文字颜色.我错过了什么?我宁愿选择白色文字和白色菜单按钮,而不是黑色文字和黑色菜单按钮:

在此输入图像描述

tyc*_*czj 181

这一切都在你提供的链接中

要将文本更改为白色,您只需更改主题即可.

使用这个主题

<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"/>
Run Code Online (Sandbox Code Playgroud)

  • 所以,似乎app:theme上的**@style/ThemeOverlay.AppCompat.Dark.ActionBar**将工具栏的文本更改为**white**和@ style/ThemeOverlay.AppCompat.Light将其更改为黑色.从android:background属性中选择背景颜色.在应用程序上:popupTheme:@ style/ThemeOverlay.AppCompat.Dark给出白色文本和黑色背景,@ style/ThemeOverlay.AppCompat.Light给出黑色文本和白色背景.https://gist.github.com/mnemonicflow/7cba09f6461ec86b22b7 (6认同)
  • 是的,只是注意到了同样的事情,它突然让人感到困惑的是,黑暗的动作栏上有浅色文字和浅色动作栏黑暗文字......谢谢! (4认同)
  • 我这样做了,但仍然有黑色字体,我错过了什么吗? (4认同)

Gab*_*tti 57

您可以使用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"
Run Code Online (Sandbox Code Playgroud)

您可以使用以下样式完全控制您的ui元素:

<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"
Run Code Online (Sandbox Code Playgroud)

  • @VaibhavGupta Appcompat需要minSdk = 7而不是21. (3认同)

Her*_*rry 9

嘿,如果你想只为android 5.0应用Material主题,那么你可以在其中添加这个主题

<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> 
Run Code Online (Sandbox Code Playgroud)

下面的行是负责任的材料设计的Actionbar的文本颜色.

<item name="android:textColorPrimary">@android:color/white</item>
Run Code Online (Sandbox Code Playgroud)


Mic*_*ern 6

您可以通过创建自定义工具栏类来动态设置自定义工具栏项颜色:

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



}
Run Code Online (Sandbox Code Playgroud)

然后在布局文件中引用它.现在您可以使用设置自定义颜色

toolbar.setItemColor(Color.Red);
Run Code Online (Sandbox Code Playgroud)

资料来源:

我在这里找到了这样做的信息:如何动态更改Android工具栏图标颜色

然后我编辑了它,改进了它,然后在这里发布:GitHub:AndroidDynamicToolbarItemColor


MrE*_*r13 5

这就是所谓的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" />
Run Code Online (Sandbox Code Playgroud)