Android實現ListView圓角效果


本文演示如何Android中實現ListView圓角效果。

 

無論是網站,還是APP,人們都愛看一些新穎的視圖效果。直角看多了,就想看看圓角,這幾年刮起了一陣陣的圓角設計風:CSS新標准納入圓角元素,特別是在iphone中幾乎隨處可見圓角設計,現在也開始出現很多圓角名片了。

 

現在就給大家實現一個圓角的ListView效果。 圓角的設計,我們並不追求到處都用,無處不用,android中有少數界面用直角確實容易顯得鋒利,和周邊界面太過對比而顯得不協調,比如大欄目列表,設置等等,而采用圓角實現,則會活潑,輕松的多,也融合的特別好。
  

先看下在IPhone中實現圓角效果的一個圖片:

  在Iphone中這種效果處處可見,但在Android中就需要我們手動實現了。 

 

我們先看下示例運行效果圖,如下所示:

 

 

 

 

實現原理: 

通過判斷ListView上點擊的項的位置,我們切換不同的選擇器,當然這個切換的動作我們需要定義在重寫ListView的onInterceptTouchEvent()方法中。

     if (itemnum==0){

    if(itemnum==(getAdapter().getCount()-1)){
        //只有一項
        setSelector(R.drawable.app_list_corner_round);
    }else{
        //第一項                            
        setSelector(R.drawable.app_list_corner_round_top);
    }
}else if(itemnum==(getAdapter().getCount()-1))
    //最后一項
    setSelector(R.drawable.app_list_corner_round_bottom);
else{
    //中間一項                            
    setSelector(R.drawable.app_list_corner_shape);
}

 

定義選擇器  

如果只有一項,我們需要四個角都是圓角,app_list_corner_round.xml文件定義如下:

  <? xml version="1.0" encoding="utf-8" ?>

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient android:startColor="#BFEEFF" 
        android:endColor="#40B9FF" 
        android:angle="270"/>
    <corners android:topLeftRadius="6dip"
        android:topRightRadius="6dip"
        android:bottomLeftRadius="6dip"
        android:bottomRightRadius="6dip"/>
</shape>

 

如果是頂部第一項,則上面兩個角為圓角,app_list_corner_round_top.xml定義如下: 

  <? xml version="1.0" encoding="utf-8" ?>

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient android:startColor="#BFEEFF" 
        android:endColor="#40B9FF" 
        android:angle="270"/>
    <corners android:topLeftRadius="6dip"
        android:topRightRadius="6dip"/>
</shape>

 

如果是底部最后一項,則下面兩個角為圓角,app_list_corner_round_bottom.xml定義如下: 

<? xml version="1.0" encoding="utf-8" ?>
< shape  xmlns:android ="http://schemas.android.com/apk/res/android" >
     < gradient  android:startColor ="#BFEEFF"  
        android:endColor
="#40B9FF"  
        android:angle
="270" />
     < corners  android:bottomLeftRadius ="6dip"
        android:bottomRightRadius
="6dip"   />
</ shape >    


如果是中間項,則應該不需要圓角, app_list_corner_shape.xml定義如下: 

<? xml version="1.0" encoding="utf-8" ?> 
< shape  xmlns:android ="http://schemas.android.com/apk/res/android" >
     < gradient  android:startColor ="#BFEEFF"  
        android:endColor
="#40B9FF"  
        android:angle
="270" />
</ shape >   


示例下載地址: 點擊下載

 

最后,希望轉載的朋友能夠尊重作者的勞動成果,加上轉載地址:http://www.cnblogs.com/hanyonglu/archive/2012/03/18/2404820.html  謝謝。

完畢。^_^ 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM