如何在应用程序工具栏中增加菜单项图标和标题之间的填充或边距？

Question

我在操作栏中有一个问题：

刷新图标与“REFRESH”标题太接近了，看起来不协调。

我知道解决这个问题的方法之一是编辑图像并强制添加填充，或将其包装在XML可绘制对象中以此达到目的。

似乎不应该通过编辑图像本身来解决这个问题。我感觉应该有一种简单的方法来更改填充或边距属性以解决这个问题。我很惊讶它们在这里如此接近。

有什么想法吗？

- Chad Schultz

---

你可以通过在菜单项标签中添加app:actionLayout="@layout/custom_layout"来实现这一点。 - Muahmmad Tayyib

Answer 1

我简直不敢相信我花了这么长时间才弄明白这个问题！

最终我想到使用Android设备监视器。我进入“工具” > “Android” > “Android设备监视器”。当它启动时，我在“设备”选项卡中点击了我的应用程序包名称，然后我点击了“设备”选项卡顶部看起来像多个手机叠在一起的“为UI Automator转储视图层次结构”按钮。这显示了我当前屏幕的用户界面(UI)。然后我可以点击“刷新”按钮并发现它不是两个相邻的视图——而是一个带有DrawableLeft的TextView。我知道，我知道，那很明显，本应该是我首先想到的事情。

我已经找到了ActionBarSherlock - 如何设置每个操作栏图标的填充？，但对我没用。但是，那给了我需要的东西的例子——更改ActionButton样式。

现在我知道它是一个带有DrawableLeft的TextView，我知道我需要改变DrawablePadding。这就是我需要在styles.xml中进行的更改。

要更改ActionButton主题，我需要在styles.xml中添加以下内容：

<style name="ActionButton" parent="@android:style/Widget.ActionButton">
    <item name="android:drawablePadding">@dimen/action_button_padding</item>
</style>

dimen.xml：

<dimen name="action_button_padding">4dp</dimen>

然后对style.xml中的Theme部分进行微调:

<style name="Theme.MyTheme"
       parent="Theme.AppCompat.Light.NoActionBar">
    <!-- other styles -->
    <item name="android:actionButtonStyle">@style/ActionButton</item>
</style>

而且它只需要运作！无需设置自定义的ActionProvider，编辑图像以在图像文件中添加间距或者为每个按钮使用额外的XML文件。

- Chad Schultz

---

是的，您可以增加项目之间的距离，但不能减少距离。负数的-10dp或-30dp没有影响。您有什么想法如何减小它吗？不管怎样，感谢您所做的工作！ :) - careful7j

Answer 2

使用菜单项中设置的自定义布局，可以像下面这样：

<item
    android:id="@+id/common_submenu_sync_contact"
    android:title="Refresh"
    app:actionLayout="@layout/custom_menu_item" />

创建布局文件并将该文件设置为 app:actionLayout。

custom_menu_item.xml

<?xml version="1.0" encoding="utf-8"?>
<ImageView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/refresh"
    android:padding="10dp" />

愉快地编码。

- dipali

---

@AhamadullahSaikat 如所述，只需添加app:actionLayout而不是android:actionLayout才能使其正常工作。 - Muahmmad Tayyib

在我的情况下，菜单项变得无法点击。Trader的答案与插图很有效。 - Vadim

Answer 3

您也可以使用内嵌可绘制对象并将填充嵌入其中。这样做还可以避免您不得不将样式应用于应用程序中的所有菜单按钮，或者担心如果在应用程序中的其他位置使用该菜单项图像会出现奇怪的填充。

<inset
   xmlns:android="http://schemas.android.com/apk/res/android"
   android:drawable="@drawable/your_drawable"
   android:insetTop="3dp"
   android:insetRight="3dp"
   android:insetBottom="3dp"
   android:insetLeft="3dp" />

- Trader

Answer 4

修复@Chad Schultz的答案，他的解决方案对我不起作用。但我更改了ActionButton的样式：

<style name="ActionButton" parent="@android:style/Widget.ActionButton">
    <item name="android:paddingStart">0dp</item>
    <item name="android:paddingEnd">0dp</item>
    <item name="android:minWidth">0dp</item>
</style>

- wizcheu

Answer 5

这可能不是最好的实践方式，但您可以在其他项目之间放置“空”的、不可点击的项目：

<item
    android:id="@+id/action_save_estimator"
    android:icon="@drawable/ic_action_tick_white"
    android:orderInCategory="1"
    android:title="@string/action_save_estimator"
    app:showAsAction="always"/>

<!--EMPTY ITEM-->
<item
    android:orderInCategory="2"
    android:title=""
    app:actionLayout="@layout/empty_item"
    app:showAsAction="always"/>

<item
    android:id="@+id/action_add"
    android:icon="@drawable/ic_add_white_24dp"
    android:title="@string/action_add"
    android:orderInCategory="3"
    app:showAsAction="always"/>

在布局组中创建empty_item.xml：

<?xml version="1.0" encoding="utf-8"?>
<ImageView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="5dp" 
    android:clickable="false"/>

- Borys Draus