2025-05-23

IOS風格的UI比較流行,很多Android的UI設計者也願意將Android的UI設計成類似IOS系統的UI風格。下面是一個例子,說明如何使用Shape來定義一個IOS風格的按鈕。

 

定義一個ios_button_grouped.xml。

<?xmlversion="1.0"encoding="UTF-8"?>

<selector

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

    <item

       android:state_pressed="true"

       android:drawable="@drawable/ios_button_grouped_pressed"/>

    <item

       android:state_focused="true"

       android:state_window_focused="true"

       android:drawable="@drawable/ios_button_grouped_pressed"/>

    <item

       android:drawable="@drawable/ios_button_grouped_normal"/>

</selector>

 

 

定義ios_button_grouped_normal.xml

<?xmlversion="1.0"encoding="utf-8"?>

<shape

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="rectangle">

    <solid

       android:color="#eee"/>

    <stroke

       android:width="1dp"

       android:color="@android:color/black"/>

    <corners

       android:radius="5dp"/>

</shape>

 

定義ios_button_grouped_pressed.xml

<?xmlversion="1.0"encoding="utf-8"?>

<shape

    xmlns:android="http://schemas.android.com/apk/res/android"

    android:shape="rectangle">

    <solid

       android:color="#0be"/>

    <stroke

       android:width="1dp"

       android:color="@android:color/black"/>

    <corners

       android:radius="5dp"/>

</shape>

 

這裡主要是定義Shape中的rectangle的顏色。還有一些顏色屬性可以設置,比如startColor,endColor,angle等等,可以定義出漂亮的UI效果。建議參考API文檔。

 

效果:

  

 

使用方法:

當做圖片作為背景使用即可。

android:background="@drawable/ios_button_grouped"

 

—————————————————————————

GL(arui319)

http://blog.csdn.net/arui319

 

摘自  迷途ф書童
  

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *