猛禽洛的程式筆記庫

[Android] 圓形背景

圓形背景在很多地方都會用到,如下圖↓

上圖就是TextView + 圓形背景的效果。

1. 在drawable按右鍵新增一個xml檔。

2. 建立一個 <shape> 圖形。

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

    <solid android:color="@color/white" />
    <size
        android:width="15dp"
        android:height="15dp" />
    <corners android:radius="180dp" />
</shape>

預覽會如下圖↓

我們畫出了一個圓形,顏色為白色。

在這邊的範例中,顏色與大小並不重要,因為之後會隨著元件去修改他。

 

3. 將背景套用至 TextView 中。

當然不一定只能用在TextView,有背景屬性的地方基本上都可以使用。

<TextView
  ...
  ...
  android:background="@drawable/round_bg"
  ...
  ... />

然後可以使用backgroundTint功能修改背景顏色。

<TextView
  ...
  ...
  android:backgroundTint="@color/light_blue_600"
  ...
  ... />

再來設定一下文字大小跟位置,並且手動指定長寬尺寸為正方形比例,完成就會如下圖↓

 

-END-

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *