shape繪制形狀基礎詳細決議

android 的樣式主要則是通過 shape、selector、layer-list、level-list、style、theme、layer、bitmap 等組合實作
這篇文章主要介紹最基礎的形狀定義工具shape

1.Android develelopers官方解釋
Defines a generic graphical “shape.”

Any Shape can be drawn to a Canvas with its own draw() method, but more graphical control is available if you instead pass it to a ShapeDrawable.

Custom Shape classes must implement clone() and return an instance of the custom Shape class.
翻譯：定義通用圖形“形狀”，
任何形狀都可以通過它自己的draw()方法繪制到畫布上，但如果你把它傳遞給一個ShapeDrawable，就可以使用更多的圖形控制元件，
自定義Shape類必須實作clone()并回傳自定義Shape類的一個實體，
2.定義與使用shape
2.1定義shape
定義Shape需要在res/drawable/目錄下建一個XML資源檔案

2.2使用shape

 <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/shape"
        android:src="@drawable/shape"/>

一般通過設定background和src依靠layout布局中控制元件進行參考，把定義好的Shape設定為背景，因為APP界面中的元素，都是通過控制元件進行展示的，形狀也是一種繪圖元素，必須依附于控制元件，
3.Shape一共支持四種形狀

①line : 線形，可以畫實線或者虛線

②oval : 橢圓形，可以畫正圓或者橢圓

③rectangle : 矩形，默認的形狀，可以畫出直角矩形、圓角矩形、弧形等

④ring : 環形，可以畫環形進度條
4.屬性介紹

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/black"/>
    <!-- 矩形的填充色 -->
    <corners android:radius="2dp"/>
    <!-- 矩形的圓角弧度 -->
    <stroke android:width="2dp"/>
    <!--矩形的外邊框-->
    <gradient android:angle="90"/>
    <!--設定形狀的漸變顏色，可以是線性漸變、輻射漸變、掃描性漸變-->
    <padding android:top="2dp"/>
    <!--設定內容與形狀邊界的內間距，可分別設定左右上下的距離 -->
    <size android:width="20dp"/>
    <!--形狀寬和高 -->
</shape>

(1)solid : 設定形狀填充的顏色，只有android:color一個屬性 
- android:color 填充的顏色
 
(2)padding: 設定內容與形狀邊界的內間距，可分別設定左右上下的距離
android:left 左內間距
android:right 右內間距
android:top 上內間距
android:bottom 下內間距
 
(3)gradient: 設定形狀的漸變顏色，可以是線性漸變、輻射漸變、掃描性漸變
android:type 漸變的型別
linear 線性漸變，默認的漸變型別
radial 放射漸變，設定該項時，android:gradientRadius也必須設定
sweep 掃描性漸變
android:startColor 漸變開始的顏色
android:endColor 漸變結束的顏色
android:centerColor 漸變中間的顏色
android:angle 漸變的角度，線性漸變時才有效，必須是 45 的倍數，0 表示從左到右，90 表示從下到上
android:angle屬性的值決定了顏色漸變的角度(環繞控制元件中間來扭轉回應的度數)
0：從左到右顏色由淺到深變化（下面也是由淺到深變化）

45：從左下角到右上角

90：從下到上顏色

135：從右下角到左上角

180：從右到左

225：從右上角到左下角

270：從下到上

315：從左上角到右下角

360：從左到右

android:centerX 漸變中心的相對X坐標，放射漸變時才有效，在0.0 到 1.0 之間，默認為 0.5，表示在正中間
android:centerY 漸變中心的相對X坐標，放射漸變時才有效，在 0.0到1.0之間，默認為0.5，表示在正中間
android:gradientRadius 漸變的半徑，只有漸變型別為 radial 時才使用
android:useLevel 如果為 true，則可在 LevelListDrawable 中使用
 
(4)corners: 設定圓角，只適用于rectangle型別，可分別設定四個角不同半徑的圓角，即當<shape>標簽中的android:shape=rectangle時有效
android:radius 圓角半徑，如果只設定這一個，代表四個方向的圓角都設定為該圓角半徑，但可以被每個特定的圓角屬性重寫
android:topLeftRadius 左上角的半徑
android:topRightRadius 右上角的半徑
android:bottomLeftRadius 左下角的半徑
android:bottomRightRadius 右下角的半徑
 
(5)stroke: 設定描邊，可描成實線或虛線，
android:color 描邊的顏色
android:width 描邊的寬度
// 以下兩個屬性設定虛線 
android:dashWidth 設定虛線時的橫線長度，值為0時是實線 
android:dashGap 虛線的間隔

(6)size
android:width 設定shape的寬度
android:height  設定shape的高度

 
//以下為只在ring中可以使用
android:innerRadius 內環的半徑

android:innerRadiusRatio 浮點型， 默認值為9，環的內半徑表示為環的寬度的比率， 例如,  如果innerRadiusRatio=9，那么內半徑等于環的寬度除以9，如果定義了innerRadius，這個值將被忽略，該值會被 android:innerRadius 覆寫，例如，如果android:innerRadiusRatio=5，表示內環半徑等于環的寬度除以5，

android:thickness 環的厚度

android:thicknessRatio 
浮點型，默認值為3，環的厚度表示為環的寬度的比率，例如, 如果厚度比=3，那么厚度等于環的寬度除以3，如果定義了thickness，這個值將被忽略，該值會被 android:thickness覆寫

android:useLevel 一般為 false，否則可能環形無法顯示，只有作為LevelListDrawable 使用時才設為 true

stroke屬性解釋：見下圖

5.作業常用形狀
5.1 圓角shape

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@color/black"/>
    <corners android:radius="15dp"/>
</shape>

這是最簡單的也是最常用的

5.2 畫下劃線虛線

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="line">

    <size android:height="1dp"/>
    <stroke
        android:dashGap="3dp"
        android:dashWidth="5dp"
        android:width="1dp"
        android:color="@color/black" />
</shape>

參考

<ImageView
        android:layout_width="wrap_content"
        android:layout_height="2dp"
        android:background="@drawable/shape"/>

注意：設定的 view 的高度必須比 shape 虛線的高度高，不然不會顯示，需要將 view 中的 layout_height 設定的比 shape中( size的height) 虛線的高度大就可以了，為了這問題也困惑了很久，我感覺這可能和View的繪制有關，如果 view 的高度比 shape 虛線小，也并不符合現實，也希望看到這篇文章的對這個問題有自己見解的大佬可以在評論區留下你的理解，

但其實意識到剛才高度的問題，但運行到真機時，在真機上依然不是虛線，而顯示的是一條實線，通過查找原因，發現原因在于 Android 3.0 之后，系統默認關閉了硬體加速功能，所以你可以在代碼中使用以下方法，

view.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
在xml中添加一句代碼android:layerType=“software”

<ImageView
        android:layout_width="wrap_content"
        android:layout_height="2dp"
        android:background="@drawable/shape"
        android:layerType="software"/>

5.3 圓環

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadius="100dp"
    android:shape="ring"
    android:thickness="50dp"
    android:useLevel="false">
    <gradient
        android:centerColor="@color/cardview_light_background"
        android:centerY="0.4"
        android:endColor="@color/design_default_color_surface"
        android:startColor="@color/black" />
</shape>