Question

我正在尝试使用“材质按钮”，在该按钮的最左端有一个图标，然后在中间有一些文本。但是，例如，当我将图标放在左侧时，我可以清楚地看到文本被推到右侧。有什么办法可以避免这种情况？我希望文本居中，并希望避免对此做一个棘手的解决方案。

<com.google.android.material.button.MaterialButton
        android:id="@+id/testButton"
        style="@style/RevertedColorDefaultButton"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="TEST"
        android:textAlignment="center"
        app:icon="@drawable/some_icon"
        app:iconGravity="start"´
        app:iconTint="@color/colorPrimary"
        app:layout_constraintBottom_toTopOf="@id/someOtherButton"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.94" />

有关信息，我使用常规按钮尝试了同样的事情，同样的问题：

<androidx.appcompat.widget.AppCompatButton
        android:id="@+id/test2Button"
        style="@style/RevertedColorDefaultButton"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:drawableStart="@drawable/some_icon"
        android:drawableTint="@color/colorPrimary"
        android:text="TEST"
        app:layout_constraintBottom_toTopOf="@id/someOtherButton"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.94" />

编辑：添加了图片

Answer 1

后来对查看此内容的任何人，我都找到了一种方法，可以通过将图标的固有宽度添加为按钮的负距填充

<button>.iconPadding = -(icon?.intrinsicWidth ?: 0)

这是因为文本正好由图标的intrinsicWidth推送

Answer 2

尝试android:textAlignment="center"。

Answer 3

您可以使用 app:iconPadding 属性来更改图标和文本之间的填充。

  <com.google.android.material.button.MaterialButton
        style="@style/Widget.MaterialComponents.Button.Icon"
        app:icon="@drawable/..."
        app:iconGravity="start"
        app:iconPadding="-xxdp"
        ../>

标准值和app:iconPadding="-8dp"：

Answer 4

我找到了一种无需创建自定义视图并添加大量自定义布局逻辑的方法。 MaterialButton似乎具有icon和iconGravity属性。请参见下面的代码和示例输出。注意：示例代码中的自定义样式扩展了Widget.MaterialComponents.Button

<com.google.android.material.button.MaterialButton
    android:id="@+id/signUpButton"
    style="@style/Button.AppTheme.Primary"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Sign up with Email"
    app:icon="@drawable/ic_envelope"
    app:iconGravity="textStart"/>

带图标的MaterialButton不会使文本居中

4 个答案: