如何修改Floating Action Button（FAB）的边框颜色？

问题原因 #

Material Components 提供的FloatingActionButton有自己的样式渲染逻辑，你现有配置的两个问题导致边框不生效：

• 设置了app:borderWidth="0dp"关闭了自带边框
• 直接使用android:background自定义drawable时，没有将android:backgroundTint设为null，默认的背景着色覆盖了自定义drawable的样式

解决方案 #

方案1：使用FAB自带边框属性（推荐，无需自定义drawable） #

直接删除自定义shape，修改FAB配置即可，代码如下：

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/floatingActionButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:elevation="2dp"
        app:rippleColor="@color/red"
        app:fabSize="auto"
        app:borderWidth="3dp"
        app:borderColor="@color/red"
        android:backgroundTint="@color/white"
        android:src="@drawable/ic_close_24"
        app:tint="@color/red"
        android:focusable="true" />

如果app:borderColor属性不生效，升级Material Components依赖到1.2.0及以上版本即可，示例依赖配置：

implementation 'com.google.android.material:material:1.9.0'

方案2：保留自定义shape #

如果需要使用你已写的shape实现边框，按如下修改即可：

1. 修改自定义shape的solid属性为白色，替代FAB的背景色配置：

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="0dp"
    android:shape="ring"
    android:thicknessRatio="2"
    android:useLevel="false" >
    <solid android:color="@color/white" />
    <stroke
        android:width="3dp"
        android:color="@color/red" />
</shape>

2. 修改FAB配置，将android:backgroundTint设为null，避免覆盖自定义drawable样式：

<com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/floatingActionButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:clickable="true"
        android:elevation="2dp"
        app:rippleColor="@color/red"
        app:fabSize="auto"
        app:borderWidth="0dp"
        android:background="@drawable/oval_border_red"
        android:backgroundTint="@null"
        android:src="@drawable/ic_close_24"
        app:tint="@color/red"
        android:focusable="true" />

内容的提问来源于stack exchange，提问作者Lộc Trần Phước