如何在没有文本的MaterialButton中将图标居中? [英] How to center icon in a MaterialButton which has no text?

问题描述

我正在使用 com.google.android.material:material 库的最新版本(即 1.1.0-alpha03 )，并且我有一个 MaterialButton 定义为带有图标且没有任何文本，如下所示:

I'm using the latest version of the com.google.android.material:material library (i.e. 1.1.0-alpha03) and I have a MaterialButton defined with an icon and no text as follows:

我希望将 MaterialButton 呈现为正方形，图标位于其中居中，但是 MaterialButton 呈现如下:

I was hoping the MaterialButton would be rendered as a square with the icon centred within it but instead the MaterialButton is rendered as follows:

如果将 iconGravity 的值更改为"textStart" ，则 MaterialButton 呈现如下:

If I change the iconGravity value to "textStart" the MaterialButton is rendered as follows:

这对图标的位置略有改善，但是图标仍然偏离中心一点.如果将 insetLeft ， insetRight ， insetTop 和 insetBottom 值更改为 0dp ，则 MaterialButton 呈现如下:

This is a slight improvement to the positioning of the icon but the icon is still a little off centre. If I change the insetLeft, insetRight, insetTop and insetBottom values to 0dp the MaterialButton is rendered as follows:

这是对按钮形状的改进，但是图标仍然偏离中心.

This is an improvement to the shape of the button but the icon is still a little off centre.

有人知道我是否可以做进一步的事情来将图标放在 MaterialButton 中?

Anyone know whether there's something further I can do to centre the icon within the MaterialButton?

推荐答案

找到了它.我缺少的属性是 app:iconPadding ="0dp" .

Found it. The attribute I was missing was app:iconPadding="0dp".

因此，根据我的实验，创建方形的 MaterialButton 所需的最小属性如下:

So, from my experiments, the minimum attributes needed to create a square MaterialButton which has a centred icon and no text is the following:

<com.google.android.material.button.MaterialButton
    android:layout_width="52dp"
    android:layout_height="52dp"
    android:insetLeft="0dp"
    android:insetTop="0dp"
    android:insetRight="0dp"
    android:insetBottom="0dp"
    app:icon="@drawable/icon_next"
    app:iconGravity="textStart"
    app:iconPadding="0dp" />

这些属性产生一个 MaterialButton ，如下所示:

These attributes produce a MaterialButton as follows:

这篇关于如何在没有文本的MaterialButton中将图标居中?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！