快捷導(dǎo)航

Android中Shape的用法詳解

更新時間：2017年07月09日 15:18:42 作者：Code_legend

工作中總是會用到shape去畫一些背景，每次都要去百度，但是很多都寫的很模糊或者屬性不是很全，所以今天自己總結(jié)了一下，給大家分享一下，自己以后也可以看

ShapeDrawable是一種很常見的Drawable，可以理解為通過顏色來構(gòu)造的圖形，它既可以是純色的圖形，也可以是具有漸變效果的圖形，ShapeDrawabled語法稍顯復(fù)雜，如下所示：

<shape
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape=["rectangle" | "oval" | "line" | "ring"] >
  <corners
    android:radius="integer"
    android:topLeftRadius="integer"
    android:topRightRadius="integer"
    android:bottomLeftRadius="integer"
    android:bottomRightRadius="integer" />
  <gradient
    android:angle="integer"
    android:centerX="integer"
    android:centerY="integer"
    android:centerColor="integer"
    android:endColor="color"
    android:gradientRadius="integer"
    android:startColor="color"
    android:type=["linear" | "radial" | "sweep"]
    android:useLevel=["true" | "false"] />
  <padding
    android:left="integer"
    android:top="integer"
    android:right="integer"
    android:bottom="integer" />
  <size
    android:width="integer"
    android:height="integer" />
  <solid
    android:color="color" />
  <stroke
    android:width="integer"
    android:color="color"
    android:dashWidth="integer"
    android:dashGap="integer" />
</shape>

•Android: shape

•有4個選項，rectangle（矩形）oval（橢圓）line（橫線）ring（圓環(huán)），默認為rectangle，需要注意line和ring需要通過標(biāo)簽來指定線的寬度和顏色等信息，否則無法達到預(yù)期效果

•首先來說一下最常用的rectangle（矩形），一般都是在按鈕或者字體上面設(shè)置一個background的Drawable。一般設(shè)置效果為正方形或者兩邊有弧度的形狀。

◦第一種情況就是設(shè)置矩形背景

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
 android:shape="rectangle" 
 > 
 <size 
 android:width="200dp" 
 android:height="20dp" 
 /> 
 <solid android:color="#d22121"/> 
 </shape>

通過設(shè)置size設(shè)置矩形的寬度和高度，*這里需要說明一下，咱們在這里設(shè)置size的寬高，在最終顯示尺寸是沒有用的，也就是說當(dāng)你在一個控件中設(shè)置background的時候，這個shape是會被拉伸或者縮小為view的大小。*solid屬性設(shè)置矩形里面的背景顏色。

這里寫圖片描述

將背景色設(shè)置為漸變

<shape xmlns:android="http://schemas.android.com/apk/res/android"
 android:shape="rectangle" 
 > 
 <size 
 android:width="200dp" 
 android:height="20dp" 
 /> 
 <gradient 
 android:startColor="#fff" 
 android:centerColor="#f1a9a9" 
 android:endColor="#ec5b5b" 
 android:type="linear" 
 /> 
 </shape>

效果圖：

這里寫圖片描述

這里默認的type就是linear，里面還有其他兩個屬性可以選擇分別是radial(徑向漸變)和sweep(掃描漸變)
一般最常用的也就是線性漸變還有其他幾個屬性沒有用但是很好理解

android:angle——漸變的角度，默認為0，其值必須是45的倍數(shù)，0表示從左到右，90表示從下到上。

android:centerX——漸變的中心點橫坐標(biāo)

android:centerY——漸變的中心點縱坐標(biāo)

android:gradientRadiu——漸變半徑，僅當(dāng)android:type=”radial”時有效

•接下來說一下畫圓角的矩形背景

◦其實只用設(shè)置一下corners的屬性就是了。

這里寫圖片描述

◦具體詳細的說明

◦android:radius—— 給四個角設(shè)置相同的角度，優(yōu)先級較低，會被其他四個屬性覆蓋

android:bottomLeftRadius——設(shè)定左下角的角度

android:bottomRightRadius——設(shè)定右下角的角度

android:TopLeftRadius——設(shè)定左上角的角度

android:TopRightRadius——設(shè)定右上角的角度

接下來就是如何畫一個空心的背景

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
 android:shape="rectangle" 
 > 
 <size 
 android:width="200dp" 
 android:height="20dp" 
 /> 
 <stroke 
 android:width="1px" 
 android:color="#ffff1c77" 
 /> 
 <corners android:radius="50dp"/> 
 </shape>

效果圖如下

這里寫圖片描述

當(dāng)然里面也可以自由發(fā)揮設(shè)置漸變色，但是一般里面都純色。

◦這里里面也可以設(shè)置為虛線

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
 android:shape="rectangle" 
 > 
 <size 
 android:width="200dp" 
 android:height="20dp" 
 /> 
 <stroke 
 android:dashWidth="4dp" 
 android:dashGap="2dp" 
 android:width="1px" 
 android:color="#ffff1c77" 
 /> 
 <corners android:radius="50dp"/> 
 </shape>

這里寫圖片描述