天天看點

Android初級進階之Shape

shape

``` xml
<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle|oval|ring|line"><!--形狀-->

<solid /><!--背景顔色-->
<corners /><!--角度,圓角-->
<gradient /><!--線性變化-->
<size /><!--大小-->
<stroke/><!--邊框-->
</shape>
```
           

rectangle

圓角矩形

圖檔

Android初級進階之Shape

xml

```xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="8dp" />
    <padding
        android:bottom="7dp"
        android:left="7dp"
        android:right="7dp"
        android:top="7dp" />
    <solid android:color="#f60" />
</shape>
```
           

使用bottomLeftRadius等屬性,可以做出不同的效果,如左兩邊圓角,右兩邊不圓角等。

Android初級進階之Shape
Android初級進階之Shape

圓角矩形-邊框

Android初級進階之Shape
``` xml 
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="@color/colorPrimaryDark" />
<corners android:radius="10dp" />
<stroke
    android:width="10dp"
    android:color="#f60" />
</shape>
```
           

虛線:

<stroke
    android:width="10dp"
    android:dashGap="3dp"<!--虛線間隔-->
    android:dashWidth="13dp"<!--虛線寬度-->
    android:color="#f60" />
           

Android初級進階之Shape

oval

實心圓

Android初級進階之Shape
```xml 
<?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="#f60" />
<size
    android:width="50dp"
    android:height="50dp" />

</shape>
```
           

實心圓-邊框

Android初級進階之Shape
```xml
<?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="#03a9f4" />
<size
    android:width="20dp"
    android:height="20dp" />
<stroke
    android:width="5dp"
    android:color="#f60" />
</shape>    
```
           

注:

虛線等與矩形相同

ring

Android初級進階之Shape
```xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="ring"
android:useLevel="false"
android:innerRadiusRatio="4"
android:thicknessRatio="8">
<solid android:color="#f00" />

<size
    android:width="100dp"
    android:height="100dp" />
</shape>
           

繼續閱讀