android通過shape.xml製作漸層背景

來源:互聯網
上載者:User

編寫xml檔案放到res/drawable-*/下面
最基本的寫法如下

<?xml version="1.0" encoding="utf-8"?>    <shape xmlns:android="http://schemas.android.com/apk/res/android">        <gradient             android:startColor="#3A3C39"             android:endColor="#181818"            android:angle="270"         />        <corners android:radius="0dp" />    </shape>

  使用方法:android:background="@drawable/shape_background_grey"   

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#3A3C39"
android:endColor="#181818"
android:angle="270"
/>
<corners android:radius="0dp"/>
</shape>

  使用方法:android:background="@drawable/shape_background_grey" 

其中 android:angle="270"  代表方向, 270表示從上到下,180表示從右至左,預設從左 

複雜一點的寫法如下

<shape xmlns:android="http://schemas.android.com/apk/res/android"  
android:shape="rectangle">
<gradient android:type="radial" android:gradientRadius="250"
android:startColor="#E9E9E9" android:endColor="#D4D4D4"/>
</shape>

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient android:angle="0" android:startColor="#FFdaf3fc"
android:centerColor="#FFd4e9a9" android:endColor="#FFdaf3fc"/>
</shape>

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient android:type="radial" android:gradientRadius="250"
android:startColor="#E9E9E9" android:endColor="#D4D4D4"/>
</shape>

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient android:angle="0" android:startColor="#FFdaf3fc"
android:centerColor="#FFd4e9a9" android:endColor="#FFdaf3fc"/>
</shape>

  在這裡要注意android:type="radial"類型的使用會有不同的效果 

android:centerColor="#FFd4e9a9" 通常這個也不是被人常用 

<?xml version="1.0" encoding="utf-8"?>   
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient android:startColor="#509245" android:centerColor="#3e8532"
android:endColor="#509245" android:type="linear" android:angle="90"
android:centerX="0.5" android:centerY="0.5"/>
<padding android:left="7dp" android:top="7dp" android:right="7dp"
android:bottom="7dp"/>
<corners android:radius="4dp"/>
</shape>

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<gradient android:startColor="#509245" android:centerColor="#3e8532"
android:endColor="#509245" android:type="linear" android:angle="90"
android:centerX="0.5" android:centerY="0.5"/>
<padding android:left="7dp" android:top="7dp" android:right="7dp"
android:bottom="7dp"/>
<corners android:radius="4dp"/>
</shape>

  android:shape 配置的是圖形的形式,主要包括方形、圓形等,上邊代碼為方形。

gradient節點主要配置起點顏色、終點顏色、中間點的座標、中間點的顏色、漸層角度(90度為上下漸層,0為左右漸層),padding節點主要配置上下左右邊距,corners節點配置四周園角的半徑。

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.