Android Button 圓角樣式在 style 中不生效？改用 Shape Drawable 做背景

問題現象

在 styles.xml 設定 <item name="android:radius">6dp</item> 試圖讓 Button 圓角，但完全無效果，只有文字顏色等屬性生效。

原因分析

android:radius、android:topLeftRadius 等屬性僅適用於 Shape Drawable（<shape>），不適用於 View 直接屬性或 Style 項目。Button 的 android:background 預設為系統九宮格圖片，Style 設定的 radius 無法穿透至背景圖片內部。

正確做法：自訂 Shape Drawable 並設為 background

1. 建立 res/drawable/btn_rounded.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="https://schemas.android.com/apk/res/android">
    <!-- 填滿顏色 -->
    <solid android:color="#FFFFFF" />
    <!-- 邊框（可選） -->
    <stroke android:width="1dp" android:color="#DCDCDC" />
    <!-- 圓角半徑 -->
    <corners android:radius="5dp" />
    <!-- 內邊距（可選） -->
    <padding android:left="0dp" android:top="0dp" android:right="0dp" android:bottom="0dp" />
</shape>

2. 佈局中套用

<Button
    android:id="@+id/button1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="ButtonText"
    android:background="@drawable/btn_rounded"
    android:textColor="#000000"
    android:textSize="16sp" />

3. 若需在 Style 中統一管理

<style name="RoundedButton" parent="Widget.AppCompat.Button">
    <item name="android:background">@drawable/btn_rounded</item>
    <item name="android:textColor">#000000</item>
    <item name="android:textSize">16sp</item>
</style>

<Button ... style="@style/RoundedButton" />

進階：按狀態切換圓角背景

建立 res/drawable/btn_rounded_selector.xml（<selector> 根標籤）：

<selector xmlns:android="https://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <shape>
            <solid android:color="#E0E0E0" />
            <corners android:radius="5dp" />
        </shape>
    </item>
    <item android:state_focused="true">
        <shape>
            <solid android:color="#F0F0F0" />
            <corners android:radius="5dp" />
        </shape>
    </item>
    <item> <!-- 預設 -->
        <shape>
            <solid android:color="#FFFFFF" />
            <stroke android:width="1dp" android:color="#DCDCDC" />
            <corners android:radius="5dp" />
        </shape>
    </item>
</selector>

再將 android:background="@drawable/btn_rounded_selector"，即可擁有按下/聚焦/預設三種圓角視覺狀態。

常見誤區

❌ 在 Style 直接寫 <item name="android:radius">...</item>。
✅ 將圓角定義於 <shape> Drawable，再由 android:background 參照。
❌ 使用 android:background="@color/white" 覆蓋了自訂 Shape。
✅ 背景務必指向 Drawable 資源，而非純顏色值。

掌握「Shape Drawable + background」模式，不僅解決 Button 圓角，也是所有 View 自訂背景（邊框、漸層、陰影、佔位圖）的基石。