Question

我无法将我的drawableLeft图标居中我可以轻松地在文本左侧放置图标，但如果我将重力设置为居中，则只有文本居中，但没有图标。

<Button
    android:id="@+id/patient_list_button"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:text="@string/patientList"
    android:drawableLeft="@drawable/ic_icon_two_heads"
    android:layout_marginBottom="15dp"
    style="@style/darkBlueButtonWithImage"/>

这就是我想要的：

这就是我所拥有的：

<style name="darkBlueButtonWithImage">
    <item name="android:drawablePadding">10dp</item>
    <item name="android:textColor">@color/white</item>
    <item name="android:paddingLeft">10dp</item>
    <item name="android:background">@drawable/radius_dark_blue_button</item>
    <item name="android:gravity">center_vertical|left</item>
    <item name="android:drawableTint">@color/white</item> <!-- has to be set in activity.java -->
</style>

我怎样才能做到这一点？

Answer 1

最后，这些年来，我们有可能以简单直观的方式实现这种行为。您所要做的就是使用Google材料库中的MaterialButton。然后使用带有图标的样式。之后，您可以使用app:iconGravity属性并将其设置为textStart

    <com.google.android.material.button.MaterialButton
        style="@style/Widget.MaterialComponents.Button.Icon"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Some text"
        app:iconGravity="textStart"
        app:icon="@drawable/some_icon" />

Answer 2

尝试超过9000次Google的方法后，我几乎总是使用ViewGroup并排放置，特别是RelativeLayout或LinearLayout，然后添加ImageView和TextView。它很蹩脚，但是drawableStart / End有很多缺少的功能，你会在你意识到“你做不到它”之前浪费了很多时间。

对齐，着色，矢量等所有这些都是“内置”可绘制的更难或不可能。

Answer 3

使用Button属性android:drawableLeft和android:drawablePadding，您无法获得预期的结果。您可以使用RelativeLayout或LinearLayout，TextView和ImageView创建自定义按钮。使用<selector>定义按钮状态（normal/pressed）行为。

这是一个工作示例。试试这个：

<!--- Custom Button -->
<RelativeLayout
    android:id="@+id/patient_list_button"
    android:layout_width="match_parent"
    android:layout_height="48dp"
    android:clickable="true"
    android:background="@drawable/custom_button_selector">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_centerInParent="true"
        android:gravity="center_vertical">

        <ImageView
            android:layout_width="24dp"
            android:layout_height="24dp"
            android:src="@drawable/icon_refresh"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dp"
            android:textSize="16dp"
            android:text="CUSTOM BUTTON"
            android:textStyle="bold"
            android:textColor="#FFFFFF"/>

    </LinearLayout>
</RelativeLayout>

<强> custom_button_selector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_pressed="true"
        android:state_enabled="true"
        android:drawable="@drawable/bg_custom_button_pressed" />
    <item
        android:state_focused="true"
        android:state_enabled="true"
        android:drawable="@drawable/bg_custom_button_pressed" />
    <item
        android:state_enabled="true"
        android:drawable="@drawable/bg_custom_button_normal" />
</selector>

<强> bg_custom_button_normal.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <!-- view background color -->
    <solid
        android:color="#01A1DD" >
    </solid>

    <!-- Here is the corner radius -->
    <corners android:radius="8dp" >
    </corners>

</shape>

<强> bg_custom_button_pressed.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <!-- view background color -->
    <solid
        android:color="#303F9F">
    </solid>

    <!-- Here is the corner radius -->
    <corners android:radius="8dp" >
    </corners>

</shape>

<强>输出：

希望这会有所帮助〜

Answer 4

a）在你的情况下增加“paddingLeft”值并缩小或删除“drawablePadding”，将值调整到合适的值;例如：

android:paddingLeft="50dp"
android:gravity="center_vertical|left"

b）使用自定义视图。

Answer 5

最简单的IMO解决方案：

yourButtonView.text = SpannableString(" ${getString(R.string.your_string)}").apply {
            setSpan(
                ImageSpan(requireContext(), R.drawable.your_icon),
                0,
                1,
                Spannable.SPAN_EXCLUSIVE_EXCLUSIVE
            )
        }

有点黑吗？也许。它适用于每个按钮（MaterialButton，AppCompatButton，Button等）吗？是的。

我更喜欢这样做，而不是去创建自定义视图之类的麻烦。

DrawableLeft在文本中心

5 个答案: