Android开发：如何用XML资源实现带自定义图标的按钮？

嘿，完全理解你想把带图标的按钮切换到XML规范实现的需求——确实，用XML定义UI组件的外观才是Android的最佳实践，不仅更易维护，还能和业务逻辑彻底解耦，比硬写在Java代码里靠谱多了。

先说说你当前Java实现的小问题：比如硬编码的6,0,50,44这些像素值，在不同分辨率的屏幕上显示效果会不一致，而且样式和代码混在一起，后续改个图标位置或者背景都得动代码，太麻烦了。

下面给你两种XML实现方案，按需选用：

1. 基础版：直接在布局里定义样式 #

直接在布局XML中使用AppCompatButton，通过自带的属性就能搞定图标和背景，完全不用写Java代码：

<androidx.appcompat.widget.AppCompatButton
    android:id="@+id/video_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="视频按钮"
    <!-- 设置按钮背景 -->
    android:background="@mipmap/roundbackgroundnormal"
    <!-- 设置左侧图标（用start代替left更适配RTL语言布局） -->
    android:drawableStart="@mipmap/video"
    <!-- 控制图标和文字的间距，用dp适配不同屏幕 -->
    android:drawablePadding="8dp"
    <!-- 按钮内边距，让整体布局更美观 -->
    android:paddingHorizontal="16dp"
    android:paddingVertical="8dp" />

2. 进阶版：支持状态切换的样式 #

如果你的按钮需要区分「正常/按下/选中」等状态，建议用StateListDrawable来定义背景和图标，这样状态切换会自动生效：

首先创建背景状态选择器drawable/btn_video_background.xml：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 按下状态的背景 -->
    <item android:drawable="@mipmap/roundbackgroundpressed" android:state_pressed="true" />
    <!-- 默认状态的背景 -->
    <item android:drawable="@mipmap/roundbackgroundnormal" />
</selector>

再创建图标状态选择器drawable/ic_video_state.xml：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 按下状态的图标 -->
    <item android:drawable="@mipmap/video_pressed" android:state_pressed="true" />
    <!-- 默认状态的图标 -->
    <item android:drawable="@mipmap/video" />
</selector>

最后在按钮里引用这两个选择器：

<androidx.appcompat.widget.AppCompatButton
    android:id="@+id/video_button"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="视频按钮"
    android:background="@drawable/btn_video_background"
    android:drawableStart="@drawable/ic_video_state"
    android:drawablePadding="8dp"
    android:paddingHorizontal="16dp"
    android:paddingVertical="8dp" />

补充：如果非要用Java代码优化 #

要是你因为某些场景必须用代码设置图标，也别硬写像素值，记得把dp转成适配屏幕的像素：

// 先在res/values/dimens.xml里定义尺寸
// <dimen name="icon_size">44dp</dimen>
// <dimen name="icon_left_padding">6dp</dimen>
int iconSize = getResources().getDimensionPixelSize(R.dimen.icon_size);
int leftPadding = getResources().getDimensionPixelSize(R.dimen.icon_left_padding);
Drawable icon = ContextCompat.getDrawable(this, R.mipmap.video);
if (icon != null) {
    icon.setBounds(leftPadding, 0, leftPadding + iconSize, iconSize);
    setCompoundDrawables(icon, null, null, null);
}

不过还是强烈推荐XML的实现方式，符合Android的设计规范，后续维护起来也省心太多～

内容的提问来源于stack exchange，提问作者artmmslv