以编程方式更改 Android 溢出菜单图标

Question

我一直在寻找一种以编程方式更改 android 中溢出菜单图标颜色的方法。

我发现的唯一选择是通过添加自定义样式永久更改图标。 问题是在不久的将来我们将需要在使用我们的应用程序期间更改此设置。

我们的应用是一系列在线平台的扩展，因此用户可以输入他们平台的网络网址。它们有自己的样式，将通过对应用的 API 调用获取。

这些可能会要求我更改图标的颜色...

目前我像这样更改操作栏中的其他图标：

if (ib != null){
            Drawable resIcon = getResources().getDrawable(R.drawable.navigation_refresh);
            resIcon.mutate().setColorFilter(StyleClass.getColor("color_navigation_icon_overlay"), PorterDuff.Mode.SRC_ATOP);
            ib.setIcon(resIcon);
}

现在我必须使用样式。

Answer 1

toolBar.overflowIcon?.setTint(Color.WHITE)

在科特林中， 改变你想要的任何颜色:)

Answer 2

不需要创建新的样式资源，只需将 setOvewflowIcon(drawable) 方法传递给工具栏对象，然后将要使用的可绘制对象作为图标传递

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
       toolbar.setOverflowIcon(getResources().getDrawable(R.drawable.ic_notifications_black_24dp));

Answer 3

有更好的解决方案。您可以在运行时以编程方式完成

toolbar.overflowIcon?.setColorFilter(colorInt, PorterDuff.Mode.SRC_ATOP)

维奥拉！

Answer 4

各位大佬，我做的很简单，请看这个sn-p如下：

@Override
    public boolean onCreateOptionsMenu(Menu menu) {
        getMenuInflater().inflate(R.menu.menu_dashboard, menu);
        MenuItem item = menu.findItem(R.id.help);
        Drawable drawable = item.getIcon();
        drawable.setColorFilter(Color.RED, PorterDuff.Mode.SRC_ATOP);
        return super.onCreateOptionsMenu(menu);
    }

如果这里有任何进一步的说明，请告诉我。

Answer 5

更改溢出图标的方法更简单。有一个示例如何更改溢出图标的颜色，但您可以对其进行调整以更改图像：

 private void setOverflowIconColor(int color) {
        Drawable overflowIcon = toolbar.getOverflowIcon();

        if (overflowIcon != null) {
            Drawable newIcon = overflowIcon.mutate();
            newIcon.setColorFilter(color, PorterDuff.Mode.MULTIPLY);
            toolbar.setOverflowIcon(newIcon);
        }
    }

Answer 6

Adneal 的回答很棒，直到最近我还在使用它。但后来我希望我的应用程序能够使用材料设计，从而使用 Theme.AppCompat.* 样式和 android.support.v7.widget.Toolbar。

是的，它停止工作，我试图通过将 Your.Theme 的父级设置为 @style/Widget.AppCompat.ActionButton.Overflow 来修复它。它通过正确设置contentDescription 工作，但在转换为ImageButton 时失败。结果是最新的(version 23) android.support.v7class OverflowMenuButton 扩展自AppCompatImageView。更改铸造类足以使其与运行 Lollipop 的 Nexus 5 上的工具栏一起使用。

然后我用 KitKat 在 Galaxy S4 上运行它，无论我尝试什么，我都无法将溢出的 contentDescription 设置为我的自定义值。但是在AppCompat styles我发现它已经有默认值了：

<item name="android:contentDescription">@string/abc_action_menu_overflow_description</item>

那么为什么不使用它呢？同样通过 Hannes 的想法（在 cmets 中），我实现了侦听器，以消除postDelayed 中的一些随机延迟时间。由于溢出图标已经在 AppCompat 库中，所以我也会使用它 - 我正在应用颜色过滤器，所以我自己不需要任何图标资源。

我的代码基于 Adneal 对 Android Lollipop 的改进：

public static void setOverflowButtonColor(final Activity activity) {
    final String overflowDescription = activity.getString(R.string.abc_action_menu_overflow_description);
    final ViewGroup decorView = (ViewGroup) activity.getWindow().getDecorView();
    final ViewTreeObserver viewTreeObserver = decorView.getViewTreeObserver();
    viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
        @Override
        public void onGlobalLayout() {
            final ArrayList<View> outViews = new ArrayList<View>();
            decorView.findViewsWithText(outViews, overflowDescription,
                    View.FIND_VIEWS_WITH_CONTENT_DESCRIPTION);
            if (outViews.isEmpty()) {
                return;
            }
            AppCompatImageView overflow=(AppCompatImageView) outViews.get(0);
            overflow.setColorFilter(Color.CYAN);
            removeOnGlobalLayoutListener(decorView,this);
        }
    });
}

根据another StackOverflow answer:

public static void removeOnGlobalLayoutListener(View v, ViewTreeObserver.OnGlobalLayoutListener listener) {
    if (Build.VERSION.SDK_INT < Build.VERSION_CODES.JELLY_BEAN) {
        v.getViewTreeObserver().removeGlobalOnLayoutListener(listener);
    }
    else {
        v.getViewTreeObserver().removeOnGlobalLayoutListener(listener);
    }
}

当然，您可以使用自己的颜色来代替Color.CYAN - activity.getResources().getColor(R.color.black);

编辑： 添加了对使用 AppCompatImageView 的最新 AppCompat 库 (23) 的支持 对于 AppCompat 22，您应该将溢出按钮投射到 TintImageView

Answer 7

从支持 23.1 开始，工具栏现在有 getOverflowIcon() 和 setOverflowIcon() 方法，所以我们可以更轻松地做到这一点：

public static void setOverflowButtonColor(final Toolbar toolbar, final int color) {
    Drawable drawable = toolbar.getOverflowIcon();
    if(drawable != null) {
        drawable = DrawableCompat.wrap(drawable);
        DrawableCompat.setTint(drawable.mutate(), color);
        toolbar.setOverflowIcon(drawable);
    }
}

Answer 8

使用 appcompat-v7:23.0.1 没有一个 @adneal 或 @michalbrz 对我有用。我必须更改 @michalbrz 答案的 2 行代码才能使其正常工作。

我正在添加一个答案，因为当前的两个答案都可能对某人有用，但如果您像我一样使用最后一个 appcompat 版本，您应该使用基于 @michalbrz 的这个：

private static void setOverflowButtonColor(final AppCompatActivity activity, final PorterDuffColorFilter colorFilter) {
    final String overflowDescription = activity.getString(R.string.abc_action_menu_overflow_description);
    final ViewGroup decorView = (ViewGroup) activity.getWindow().getDecorView();
    final ViewTreeObserver viewTreeObserver = decorView.getViewTreeObserver();
    viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
        @Override
        public void onGlobalLayout() {
            final ArrayList<View> outViews = new ArrayList<>();
            decorView.findViewsWithText(outViews, overflowDescription,
                    View.FIND_VIEWS_WITH_CONTENT_DESCRIPTION);
            if (outViews.isEmpty()) {
                return;
            }
            ActionMenuItemView overflow = (ActionMenuItemView)outViews.get(0);
            overflow.getCompoundDrawables()[0].setColorFilter(colorFilter);
            removeOnGlobalLayoutListener(decorView,this);
        }
    });
}

使用 michalbrz 代码时出现此错误：

java.lang.ClassCastException: android.support.v7.internal.view.menu.ActionMenuItemView cannot be cast to android.support.v7.internal.widget.TintImageView

所以，在对ActionMenuItemView 的代码进行了一些挖掘之后，我找到了如何获取图标的可绘制对象（查看setIcon()），然后我将转换为ActionMenuItemView，将颜色过滤器应用于左侧可绘制对象来自getCompoundDrawables() 和瞧！它有效！

Answer 9

根据@michalbrz 的回答，我使用以下内容更改图标本身。 :)

public static void setOverflowButtonColor(final Activity activity) {
        final String overflowDescription = activity.getString(R.string.abc_action_menu_overflow_description);
        final ViewGroup decorView = (ViewGroup) activity.getWindow().getDecorView();
        final ViewTreeObserver viewTreeObserver = decorView.getViewTreeObserver();
        viewTreeObserver.addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
            @Override
        public void onGlobalLayout() {
            final ArrayList<View> outViews = new ArrayList<View>();
            decorView.findViewsWithText(outViews, overflowDescription,
                    View.FIND_VIEWS_WITH_CONTENT_DESCRIPTION);
            if (outViews.isEmpty()) {
                return;
            }
            TintImageView overflow = (TintImageView) outViews.get(0);
            //overflow.setColorFilter(Color.CYAN); //changes color
            overflow.setImageResource(R.drawable.dots);
            removeOnGlobalLayoutListener(decorView, this);
        }
    });

Answer 10

您实际上可以使用一个小技巧以编程方式更改溢出图标。这是一个例子：

为溢​​出菜单创建样式并传入内容描述

<style name="Widget.ActionButton.Overflow" parent="@android:style/Widget.Holo.ActionButton.Overflow">
    <item name="android:contentDescription">@string/accessibility_overflow</item>
</style>

<style name="Your.Theme" parent="@android:style/Theme.Holo.Light.DarkActionBar">
    <item name="android:actionOverflowButtonStyle">@style/Widget.ActionButton.Overflow</item>
</style>

现在致电ViewGroup.findViewsWithText 并传递您的内容描述。所以，类似：

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    // The content description used to locate the overflow button
    final String overflowDesc = getString(R.string.accessibility_overflow);
    // The top-level window
    final ViewGroup decor = (ViewGroup) getWindow().getDecorView();
    // Wait a moment to ensure the overflow button can be located
    decor.postDelayed(new Runnable() {

        @Override
        public void run() {
            // The List that contains the matching views
            final ArrayList<View> outViews = new ArrayList<>();
            // Traverse the view-hierarchy and locate the overflow button
            decor.findViewsWithText(outViews, overflowDesc,
                    View.FIND_VIEWS_WITH_CONTENT_DESCRIPTION);
            // Guard against any errors
            if (outViews.isEmpty()) {
                return;
            }
            // Do something with the view
            final ImageButton overflow = (ImageButton) outViews.get(0);
            overflow.setImageResource(R.drawable.ic_action_overflow_round_red);

        }

    }, 1000);
}

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Add a dummy item to the overflow menu
    menu.add("Overflow");
    return super.onCreateOptionsMenu(menu);
}

View.findViewsWithText 是在 API 级别 14 中添加的，因此您必须使用自己的兼容性方法：

static void findViewsWithText(List<View> outViews, ViewGroup parent, String targetDescription) {
    if (parent == null || TextUtils.isEmpty(targetDescription)) {
        return;
    }
    final int count = parent.getChildCount();
    for (int i = 0; i < count; i++) {
        final View child = parent.getChildAt(i);
        final CharSequence desc = child.getContentDescription();
        if (!TextUtils.isEmpty(desc) && targetDescription.equals(desc.toString())) {
            outViews.add(child);
        } else if (child instanceof ViewGroup && child.getVisibility() == View.VISIBLE) {
            findViewsWithText(outViews, (ViewGroup) child, targetDescription);
        }
    }
}

结果