溢出菜单和子菜单中的色调菜单图标



我设法在工具栏的溢出菜单和子菜单中显示图标,但我找不到如何根据它们的位置对图标进行着色。这是我使用的代码:

@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toolbar_main, menu);
// Show icons in overflow menu
if (menu instanceof MenuBuilder) {
MenuBuilder m = (MenuBuilder) menu;
m.setOptionalIconsVisible(true);
}
// Change icons color
changeIconsColor(menu, colorNormal, colorInMenu, false);
return super.onCreateOptionsMenu(menu);
}
public static void changeIconsColor(Menu menu, int colorNormal, int colorInMenu, boolean isInSubMenu) {
// Change icons color
for (int i = 0; i < menu.size(); i++) {
MenuItem item = menu.getItem(i);
Drawable icon = item.getIcon();
if (icon != null) {
int color = (((MenuItemImpl) item).requiresActionButton() ? colorNormal : colorInMenu);
icon.setColorFilter(color, PorterDuff.Mode.SRC_IN);
icon.setAlpha(item.isEnabled() ? 255 : 128);
}
if (item.hasSubMenu()) {
changeIconsColor(item.getSubMenu(), colorNormal, colorInMenu, true);
}
}
}

使用MenuItem.requiresActionButton()可以知道项目是否具有 XML 中showAsAction属性中的值neveralways,但不能知道它是否具有ifRoom值。因此,如果我想要适当的着色,我不能在项目中使用ifRoom值,这是非常严格的。

  • 有没有办法在所有情况下正确着色菜单项?

  • 更重要的是,是否有一种内置的方法来为具有主题或样式的项目着色,从而避免我使用这段复杂的代码?即使解决方案不包括溢出菜单中的图标,我也想知道它。

如果没有其他方法,我完全可以使用反射。

不幸的是,无法使用主题或样式设置菜单项图标颜色的色调。您需要一种方法来检查MenuItem是否在ActionBar或溢出菜单中可见。本机和支持MenuItemImpl类都有一个方法,但它们要么仅限于库,要么隐藏。这需要反思。您可以使用以下方法检查菜单项是否可见,然后设置颜色过滤器:

public static boolean isActionButton(@NonNull MenuItem item) {
if (item instanceof MenuItemImpl) {
return ((MenuItemImpl) item).isActionButton();
} else {
// Not using the support library. This is a native MenuItem. Reflection is needed.
try {
Method m = item.getClass().getDeclaredMethod("isActionButton");
if (!m.isAccessible()) m.setAccessible(true);
return (boolean) m.invoke(item);
} catch (Exception e) {
return false;
}
}
}

您还需要等到菜单膨胀后再对项目进行着色。为此,您可以获取对ActionBar的引用,并在绘制ActionBar后对MenuItem进行着色。

例:

@Override public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
int id = getResources().getIdentifier("action_bar", "id", "android");
ViewGroup actionBar;
if (id != 0) {
actionBar = (ViewGroup) findViewById(id);
} else {
// You must be using a custom Toolbar. Use the toolbar view instead.
// actionBar = yourToolbar
}
actionBar.post(new Runnable() {
@Override public void run() {
// Add code to tint menu items here 
}
});
return super.onCreateOptionsMenu(menu);
}

这是我为帮助对菜单项图标进行着色而编写的一个类:https://gist.github.com/jaredrummler/7816b13fcd5fe1ac61cb0173a1878d4f

多亏了@JaredRummler,我找到了一种方法来确定图标是否在溢出菜单中。我在这里发布了完整的代码,收集了他的答案的元素。我还添加了一个辅助方法,用于为着色图标获取正确的颜色。这是我目前使用的:

主题实用工具

public final class ThemeUtils {
/**
* Obtain colors of a context's theme from attributes
* @param context    themed context
* @param colorAttrs varargs of color attributes
* @return array of colors in the same order as the array of attributes
*/
public static int[] getColors(Context context, int... colorAttrs) {
TypedArray ta = context.getTheme().obtainStyledAttributes(colorAttrs);
int[] colors = new int[colorAttrs.length];
for (int i = 0; i < colorAttrs.length; i++) {
colors[i] = ta.getColor(i, 0);
}
ta.recycle();
return colors;
}
/**
* Get the two colors needed for tinting toolbar icons
* The colors are obtained from the toolbar's theme and popup theme
* These themes are obtained from {@link R.attr#toolbarTheme} and {@link R.attr#toolbarPopupTheme}
* The two color attributes used are:
* - {@link android.R.attr#textColorPrimary} for the normal color
* - {@link android.R.attr#textColorSecondary} for the color in a menu
* @param context activity context
* @return int[2]{normal color, color in menu}
*/
public static int[] getToolbarColors(Context context) {
// Get the theme and popup theme of a toolbar
TypedArray ta = context.getTheme().obtainStyledAttributes(
new int[]{R.attr.toolbarTheme, R.attr.toolbarPopupTheme});
Context overlayTheme = new ContextThemeWrapper(context, ta.getResourceId(0, 0));
Context popupTheme = new ContextThemeWrapper(context, ta.getResourceId(1, 0));
ta.recycle();
// Get toolbar colors from these themes
int colorNormal = ThemeUtils.getColors(overlayTheme, android.R.attr.textColorPrimary)[0];
int colorInMenu = ThemeUtils.getColors(popupTheme, android.R.attr.textColorSecondary)[0];
return new int[]{colorNormal, colorInMenu};
}
/**
* Change the color of the icons of a menu
* Disabled items are set to 50% alpha
* @param menu        targeted menu
* @param colorNormal normal icon color
* @param colorInMenu icon color for popup menu
* @param isInSubMenu whether menu is a sub menu
*/
private static void changeIconsColor(View toolbar, Menu menu, int colorNormal, int colorInMenu, boolean isInSubMenu) {
toolbar.post(() -> {
// Change icons color
for (int i = 0; i < menu.size(); i++) {
MenuItem item = menu.getItem(i);
changeMenuIconColor(item, colorNormal, colorInMenu, isInSubMenu);
if (item.hasSubMenu()) {
changeIconsColor(toolbar, item.getSubMenu(), colorNormal, colorInMenu, true);
}
}
});
}
public static void changeIconsColor(View toolbar, Menu menu, int colorNormal, int colorInMenu) {
changeIconsColor(toolbar, menu, colorNormal, colorInMenu, false);
}
/**
* Change the color of a single menu item icon
* @param item        targeted menu item
* @param colorNormal normal icon color
* @param colorInMenu icon color for popup menu
* @param isInSubMenu whether item is in a sub menu
*/
@SuppressLint("RestrictedApi")
public static void changeMenuIconColor(MenuItem item, int colorNormal, int colorInMenu, boolean isInSubMenu) {
if (item.getIcon() != null) {
Drawable icon = item.getIcon().mutate();
int color = (((MenuItemImpl) item).isActionButton() && !isInSubMenu ? colorNormal : colorInMenu);
icon.setColorFilter(color, PorterDuff.Mode.SRC_IN);
icon.setAlpha(item.isEnabled() ? 255 : 128);
item.setIcon(icon);
}
}
}

活动实用程序

public final class ActivityUtils {
/**
* Force show the icons in the overflow menu and submenus
* @param menu target menu
*/
public static void forceShowMenuIcons(Menu menu) {
if (menu instanceof MenuBuilder) {
MenuBuilder m = (MenuBuilder) menu;
m.setOptionalIconsVisible(true);
}
}
/**
* Get the action bar or toolbar view in activity
* @param activity activity to get from
* @return the toolbar view
*/
public static ViewGroup findActionBar(Activity activity) {
int id = activity.getResources().getIdentifier("action_bar", "id", "android");
ViewGroup actionBar = null;
if (id != 0) {
actionBar = activity.findViewById(id);
}
if (actionBar == null) {
return findToolbar((ViewGroup) activity.findViewById(android.R.id.content).getRootView());
}
return actionBar;
}
private static ViewGroup findToolbar(ViewGroup viewGroup) {
ViewGroup toolbar = null;
for (int i = 0; i < viewGroup.getChildCount(); i++) {
View view = viewGroup.getChildAt(i);
if (view.getClass() == android.support.v7.widget.Toolbar.class ||
view.getClass() == android.widget.Toolbar.class) {
toolbar = (ViewGroup) view;
} else if (view instanceof ViewGroup) {
toolbar = findToolbar((ViewGroup) view);
}
if (toolbar != null) {
break;
}
}
return toolbar;
}
}

我还在attrs.xml中定义了两个属性:toolbarThemetoolbarPopupTheme,分别是我在 XML 中的工具栏布局上设置的。它们的值在themes.xml的我的应用程序主题中定义。ThemeUtils.getToolbarColors(Context)使用这些属性来获取用于着色图标的颜色,因为工具栏通常使用主题叠加。通过这样做,我只能通过更改这两个属性的值来更改每个工具栏的主题。

剩下的就是在活动的onCreateOptionsMenu(Menu menu)中调用以下内容:

ActivityUtils.forceShowMenuIcons(menu);  // Optional, show icons in overflow and submenus
View toolbar = ActivityUtils.findActionBar(this);  // Get the action bar view
int[] toolbarColors = ThemeUtils.getToolbarColors(this);  // Get the icons colors
ThemeUtils.changeIconsColor(toolbar, menu, toolbarColors[0], toolbarColors[1]);

同样的事情可以通过将this替换为getActivity().

更新菜单项图标时,可以调用另一个方法,ThemeUtils.changeMenuIconColor()。在这种情况下,可以在onCreate中获取工具栏颜色并全局存储以重复使用它们。

这是一个适用于材料组件的解决方案MaterialToolbar

解释

  • 代码检查工具栏的所有子视图 => 这些是可见项
  • 它递归迭代所有菜单项,并检查菜单 ID 是否是可见视图 ID 的一部分,如果是,这意味着菜单项位于工具栏上,否则位于溢出菜单内
  • 然后,它会根据其位置对图标进行着色
  • 它还对溢出图标进行着色
  • 要正确着色子菜单箭头指示器,请查看以下问题:https://github.com/material-components/material-components-android/issues/553

法典

fun View.getAllChildrenRecursively(): List<View> {
val result = ArrayList<View>()
if (this !is ViewGroup) {
result.add(this)
} else {
for (index in 0 until this.childCount) {
val child = this.getChildAt(index)
result.addAll(child.getAllChildrenRecursively())
}
}
return result
}
@SuppressLint("RestrictedApi")
fun MaterialToolbar.tintAndShowIcons(colorOnToolbar: Int, colorInOverflow: Int) {
(menu as? MenuBuilder)?.setOptionalIconsVisible(true)
val c1 = ColorStateList.valueOf(colorOnToolbar)
val c2 = PorterDuffColorFilter(colorInOverflow, PorterDuff.Mode.SRC_IN)
val idsShowing = ArrayList<Int>()
getAllChildrenRecursively().forEach {
// Icon in Toolbar
(it as? ActionMenuItemView)?.let {
idsShowing.add(it.id)
}
// Overflow Icon
(it as? ImageView)?.imageTintList = c1
}
menu.forEach {
checkOverflowMenuItem(it, c2, idsShowing)
}
}
private fun checkOverflowMenuItem(menuItem: MenuItem, iconColor: ColorFilter, idsShowing: ArrayList<Int>) {
// Only change Icons inside the overflow
if (!idsShowing.contains(menuItem.itemId)) {
menuItem.icon?.colorFilter = iconColor
}
menuItem.subMenu?.forEach {
checkOverflowMenuItem(it, iconColor, idsShowing)
}
}

最新更新