android ListView實現圓角

首先呢,我們還是看幾個示圖:(這是360推出的一款天氣預報APP(墨跡),很不錯的一款哦,這裡為她們做一個免費廣告,哈哈.)
[java]
                
               
這種帶有圓角的listview' 看起來很棒吧,確實是這樣,其實也不能這麼說,主要方形太多瞭,斯通見慣就不值錢瞭,“物以稀為貴嘛”. 就好比學java都搞androd,很明顯嘛,為瞭多賺點錢,可是供過於求的話,就不這麼樂觀瞭,就好比現在這個圓角,如果太多太多的話,我想若幹時間段,肯定會被新的視圖所代替.所以“跟隨潮流,放寬眼線”很重要.不扯瞭,(網上實現例子很多)下面簡單介紹下實現方法:(兩種方法)
第一種:我們通過配置文件也就是shape自己實現圓角的背景,以及selector選中某項的背景.
首先我們要實現一個完整的圓角背景,用於默認與listview的background.
[java]
<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" > 
 
    <stroke 
        android:width="1dp" 
        android:color="@color/gray" /> 
 
    <solid android:color="@color/white" /> 
 
    <corners android:radius="8dp" /> 
 
</shape> 
接下來我們要實現也就是listview的第一項selector後背景的shape.
[java] 
<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" > 
 
    <stroke 
        android:width="1dp" 
        android:color="@color/gray" /> 
 
    <solid android:color="@color/gray" /> 
 
    <corners 
        android:topLeftRadius="8dp" 
        android:topRightRadius="8dp" /> 
 
</shape> 
下面呢,我們也要實現中間的shape,以及末尾的shape等等配置.這裡就不寫瞭.按照上面模仿就ok瞭.

第二種方法:我們用.9.png完全代替上面那些配置,(因為.9.png可以拉伸不毀容)
所以listview的第一項,中間項,最後一項,以及就一項,我們都可以通過圖片來實現.
這裡我運用第一種方法:(也鞏固下shape)
創建自定義的listview,用於實現setSelector 及選中的效果.
   代碼片段:
  
[java] 
package com.jj.listview; 
 
import android.content.Context; 
import android.util.AttributeSet; 
import android.view.MotionEvent; 
import android.widget.AdapterView; 
import android.widget.ListView; 
 
/***
 * 自定義listview
 * 
 * @author Administrator
 * 
 */ 
public class MyListView extends ListView { 
    public MyListView(Context context) { 
        super(context); 
    } 
 
    public MyListView(Context context, AttributeSet attrs) { 
        super(context, attrs); 
    } 
 
    /****
     * 攔截觸摸事件
     */ 
    @Override 
    public boolean onInterceptTouchEvent(MotionEvent ev) { 
        switch (ev.getAction()) { 
        case MotionEvent.ACTION_DOWN: 
            int x = (int) ev.getX(); 
            int y = (int) ev.getY(); 
            int itemnum = pointToPosition(x, y); 
            if (itemnum == AdapterView.INVALID_POSITION) 
                break; 
            else { 
                if (itemnum == 0) { 
                    if (itemnum == (getAdapter().getCount() – 1)) { 
                        // 隻有一項 
                        setSelector(R.drawable.list_round); 
                    } else { 
                        // 第一項 
                        setSelector(R.drawable.list_top_round); 
                    } 
                } else if (itemnum == (getAdapter().getCount() – 1)) 
                    // 最後一項 
                    setSelector(R.drawable.list_bottom_round); 
                else { 
                    // 中間項 
                    setSelector(R.drawable.list_center_round); 
                } 
            } 
            break; 
        case MotionEvent.ACTION_UP: 
            break; 
        } 
        return super.onInterceptTouchEvent(ev); 
    } 

這段代碼網上很多,幾乎全部都是這麼實現的,這裡我簡單介紹,如果說錯瞭,請大傢指出,
首先我們是實現瞭onInterceptTouchEvent這個方法,在這裡我們也可以用onTouchEvent事件,都可以實現我們想要的效果.
onInterceptTouchEvent和onTouchEvent的區別:簡單的來說前者可以攔截後者.
 下面一些邏輯雖說沒有見過,我想大傢都看得懂,(就是獲取坐標(x,y),然後根據坐標獲取listview相應的position值,沒有返回-1,然後根據相應的position設置相應的setSelector ).有時間得好好研究下listview.對靈活運用很有幫助.

在這裡我還要在說名一點,上面那個圖形很顯然不是一個listview,是三個listview,另外重要的是我們一個屏幕顯示不完全,這時我們就用到瞭ScrollView,一提到這個我想大傢都知道ScrollView和listview是冤傢,不可能同時存在,不過網上有解決辦法,原理就是我們動態show 我們的listview,
實現方法:
[java] 
/***
     * 動態設置listview的高度
     * 
     * @param listView
     */ 
    public void setListViewHeightBasedOnChildren(ListView listView) { 
        ListAdapter listAdapter = listView.getAdapter(); 
        if (listAdapter == null) { 
            return; 
        } 
        int totalHeight = 0; 
        for (int i = 0; i < listAdapter.getCount(); i++) { 
            View listItem = listAdapter.getView(i, null, listView); 
            listItem.measure(0, 0); 
            totalHeight += listItem.getMeasuredHeight(); 
        } 
        ViewGroup.LayoutParams params = listView.getLayoutParams(); 
        params.height = totalHeight 
                + (listView.getDividerHeight() * (listAdapter.getCount() – 1)); 
        // params.height += 5;// if without this statement,the listview will be 
        // a 
        // little short 
        // listView.getDividerHeight()獲取子項間分隔符占用的高度 
        // params.height最後得到整個ListView完整顯示需要的高度 
        listView.setLayoutParams(params); 
    } 
我們在Listview的setAdapter後,在調用下這個方法就OK瞭,代碼內容,我想大傢都看的明白,就不多介紹瞭.
效果圖:         
        
樣子雖醜陋瞭點,但是實現效果就行瞭,如果在項目中就另當別論瞭。
哈哈,實現起來簡單吧,睡覺去.

發佈留言