如何使自定义XML圆形背景完全覆盖FloatingActionButton？

I’ve dealt with this exact issue before—FloatingActionButtons (FABs) come with default padding, insets, and background tinting that can prevent your custom drawable from filling the entire button. Here’s how to fix it step by step:

1. Optimize Your red_circle.xml Drawable #

Make sure your drawable adapts to the FAB’s size without unnecessary fixed constraints. Use an oval shape with solid red fill:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <!-- Solid red fill -->
    <solid android:color="#FF0000" />
    <!-- Optional: Add a border if needed -->
    <!-- <stroke android:width="1dp" android:color="#000000" /> -->
</shape>

2. Adjust FAB Properties in Your Layout #

Override the FAB’s default behaviors that block your drawable from expanding fully:

<com.google.android.material.floatingactionbutton.FloatingActionButton
    android:id="@+id/your_fab_id"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="0dp" <!-- Remove internal padding pushing drawable inward -->
    app:useCompatPadding="false" <!-- Disable default compatibility insets -->
    app:backgroundTint="@null" <!-- Clear default tint that overrides your drawable color -->
    app:elevation="0dp" <!-- Optional: Remove shadow if you don’t need it -->
    android:background="@drawable/red_circle" />

Key Property Breakdown: #

• app:backgroundTint="@null": This is often the hidden culprit—FABs have a default background tint that will cover your drawable’s color if left enabled.
• app:useCompatPadding="false": Removes extra padding added for older Android versions, which cuts off your drawable’s edges.
• android:padding="0dp": Ensures no internal padding shrinks the space available for your drawable.
• app:elevation="0dp": If you keep elevation, the shadow might create a visual "border" around your drawable. If you want shadow, keep this property but you can adjust app:shadowCompatPadding to align it with your drawable.

3. Optional: Force Fixed Size for FAB #

If gaps still appear, set a fixed width/height for the FAB to give your drawable a clear boundary to fill:

android:layout_width="64dp"
android:layout_height="64dp"

That should make your red circle drawable cover the entire FAB perfectly!

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