android shape的使用詳解以及經常使用效果(漸變色、分割線、邊框、半透明陰影效果等)

shape使用、漸變色、分割線、邊框、半透明、半透明陰影效果。html

首先簡單瞭解一下shape中常見的屬性。(詳細介紹參看 api文檔android

轉載請註明:Rflyee_大飛:http://blog.csdn.net/rflyee/article/details/20785495
api

<?xml version="1.0" encoding="utf-8"?>
<shape
   
xmlns:android="http://schemas.android.com/apk/res/android"
   
android:shape=["rectangle" | "oval" | "line" | "ring"] >   --- 默認爲rectangle
   
<corners  -- shape=「rectangle」時使用,
       
android:radius="integer"  -- 半徑,會被下邊的屬性覆蓋,默認爲1dp,
       
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    -- 指定大小,通常用在imageview配合scaleType屬性使用。大小通常會適配滴
       
android:width="integer"
       
android:height="integer" />
   
<solid    -- 填充顏色,但是是十六進制顏色。(好比想設置半透明效果,直接使用十六就只就OK)
       
android:color="color" />
   
<stroke    -- 指定邊框,border,dashWidth和dashGap有一個爲0dp則爲
       
android:width="integer"
       
android:color="color"
       
android:dashWidth="integer"    -- 虛線寬度
       
android:dashGap="integer" />    -- 虛線間隔寬度
</shape>

注意:eclipse

<corners>spa

一、android:radius,半徑,會被下邊的單個角度半徑屬性覆蓋,默認爲1dp,.net

二、在使用時,若是單獨設置四個角度,又大小不一致時,eclipse的graphics preview會報錯。可是直接真機運行便可。(好比實線上邊直角,下邊屈角的效果)rest

<size>code

Note: The shape scales to the size of the container View proportionate to the dimensions defined here, by default. When you use the shape in an ImageView, you can restrict scaling by setting the android:scaleType to "center"xml


  • 舉個栗子:htm

一、漸變色

  •  res/drawable/gradient_box.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
   
android:shape="rectangle">
   
<gradient
       
android:startColor="#FFFF0000"
       
android:endColor="#80FF00FF"
       
android:angle="45"/>
   
<padding android:left="7dp"
       
android:top="7dp"
       
android:right="7dp"
       
android:bottom="7dp" />
   
<corners android:radius="8dp" />
</shape>

如圖:




二、白色邊框、半透明效果


view plaincopy to clipboardprint?

  1. <?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"    android:shape="rectangle" >    <corners android:radius="16dp" />    <!-- 這是半透明,還能夠設置全透明,那就是白色邊框的效果了 -->    <solid android:color="#80065e8d" />    <stroke        android:dashGap="0dp"        android:width="4dp"        android:color="@android :color/white" /></shape>  

如圖:

   

三、分割線效果:

view plaincopy to clipboardprint?

  1. <?xml version="1.0" encoding="utf-8"?><shape xmlns:android="http://schemas.android.com/apk/res/android"    android:shape="line" >    <stroke        android:width="4dp"        android:color="@android :color/black" /></shape>  


若是:


四、單邊屈角效果

view plaincopy to clipboardprint?

  1. <?xml version="1.0" encoding="utf-8"?><shape android:shape="rectangle" xmlns:android="http://schemas.android.com/apk/res/android">    <corners         android:topLeftRadius="5dp"        android:topRightRadius="5dp"        android:bottomLeftRadius="30dp"        android:bottomRightRadius="30dp"/>    <!-- 這是半透明,還能夠設置全透明,那就是白色邊框的效果了 -->    <solid android:color="#ff065e8d" />    <stroke        android:dashGap="0dp"        android:width="4dp"        android:color="@android :color/white" /></shape>  


如圖:

相關文章
相關標籤/搜索