android學習日記16–GridView(網格視圖)

一、GridView

 

1、簡述  

 

  GridView按照行列來顯示圖片或文本的一種視圖,排列其實有點類似TableLayout佈局,

 

不過和TableLayout還是差別很大的,倒比較像二維的ListView。位於android.widget包下,常常用來實現類似九宮格的圖像。

實現手法和ListView有點相似,用Apapter把數據綁定到控件上,為容器提供子視圖,利用視圖的數據和元數據來構建每個子視圖自定義Adapter顯示。

如果需要自定義適配器 可以擴展抽象類BaseAdapter。

 

 

 

2、常用屬性和對應方法如下:

 

 

 

 

 

下面用實例化SimpleAdapter和繼承抽象類BaseAdapter方法實現下圖的例子:

 

 

 

 

3、實例化SimpleAdapter實現

 

 Activity代碼:

 

 

 1     private GridView gv; 

 2     @Override

 3     protected void onCreate(Bundle savedInstanceState) { 

 4        // TODO Auto-generated method stub 

 5        super.onCreate(savedInstanceState); 

 6        setContentView(R.layout.gridview); 

 7 

 8        //準備要添加的數據條目 

 9        List<Map<String, Object>> items = new ArrayList<Map<String,Object>>(); 

10        for (int i = 0; i < 9; i++) { 

11          Map<String, Object> item = new HashMap<String, Object>(); 

12          item.put("imageItem", R.drawable.ic_launcher);//添加圖像資源的ID   

13          item.put("textItem", "icon" + i);//按序號添加ItemText   

14          items.add(item); 

15        } 

16 

17       //實例化SimpleAdapter適配器 

18        SimpleAdapter adapter = new SimpleAdapter(this,  

19                                                    items,  

20                                                    R.layout.grid_item,  

21                                                    new String[]{"imageItem", "textItem"},  

22                                                    new int[]{R.id.image_item, R.id.text_item}); 

23 

24        

25        //獲得GridView實例 

26        gv = (GridView)findViewById(R.id.mygridview); 

27        //為GridView設置適配器 

28        gv.setAdapter(adapter); 

29 

30     }

 

單個組件XML:

 

 

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

 2 <RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"

 3    android:id="@+id/RelativeLayout1"

 4    android:layout_width="wrap_content"  

 5    android:layout_height="fill_parent"

 6    android:paddingBottom="6dip"

 7    >

 8    <ImageView  

 9       android:id="@+id/image_item"

10       android:layout_width="wrap_content"

11       android:layout_height="wrap_content"

12       android:layout_centerHorizontal="true"

13       android:src="@drawable/ic_launcher"

14       />

15    <TextView  

16       android:id="@+id/text_item"

17       android:layout_below="@+id/image_item"

18       android:layout_height="wrap_content"

19       android:layout_width="wrap_content"

20       android:layout_centerHorizontal="true"    

21       />

22 </RelativeLayout>

 

頁面主佈局XML:

 

 

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

 2 <LinearLayout xmlns:android="https://schemas.android.com/apk/res/android"

 3    android:layout_width="wrap_content"

 4    android:layout_height="wrap_content"

 5    >

 6    <GridView  

 7       android:id="@+id/mygridview"

 8       android:numColumns="3"

 9       android:gravity="center_horizontal"

10       android:layout_width="wrap_content"

11       android:layout_height="wrap_content"

12       android:stretchMode="columnWidth"

13       />

14 </LinearLayout>

 

 

 

4、繼承抽象類BaseAdapter實現

 

替換成自己GridAdapter代碼:

 

 

 1 //       //準備要添加的數據條目 

 2 //       List<Map<String, Object>> items = new ArrayList<Map<String,Object>>(); 

 3 //       for (int i = 0; i < 9; i++) { 

 4 //         Map<String, Object> item = new HashMap<String, Object>(); 

 5 //         item.put("imageItem", R.drawable.ic_launcher);//添加圖像資源的ID   

 6 //         item.put("textItem", "icon" + i);//按序號添加ItemText   

 7 //         items.add(item); 

 8 //       } 

 9 //

10 //      //實例化SimpleAdapter適配器 

11 //       SimpleAdapter adapter = new SimpleAdapter(this,  

12 //                                                   items,  

13 //                                                   R.layout.grid_item,  

14 //                                                   new String[]{"imageItem", "textItem"},  

15 //                                                   new int[]{R.id.image_item, R.id.text_item}); 

16 

17        

18       List<GridInfo> list = new ArrayList<GridInfo>();  

19        for (int i = 0; i < 9; i++) { 

20            list.add(new GridInfo("icon"+i));  

21        } 

22        

23        GridAdapter adapter = new GridAdapter(this);  

24        adapter.setList(list);

 

補上GridAdapter代碼:

 

 

 1 public class GridAdapter extends BaseAdapter {  

 2       

 3     private class GridHolder {  

 4         ImageView appImage;  

 5         TextView appName;  

 6     }  

 7   

 8     private Context context;  

 9   

10     private List<GridInfo> list;  

11     private LayoutInflater mInflater;  

12   

13     public GridAdapter(Context c) {  

14         super();  

15         this.context = c;  

16     }  

17   

18     public void setList(List<GridInfo> list) {  

19         this.list = list;  

20         mInflater = (LayoutInflater) context  

21                 .getSystemService(Context.LAYOUT_INFLATER_SERVICE);  

22   

23     }  

24   

25     public int getCount() {  

26         // TODO Auto-generated method stub  

27         return list.size();  

28     }  

29   

30     @Override  

31     public Object getItem(int index) {  

32   

33         return list.get(index);  

34     }  

35   

36     @Override  

37     public long getItemId(int index) {  

38         return index;  

39     }  

40   

41     @Override  

42     public View getView(int index, View convertView, ViewGroup parent) {  

43         GridHolder holder;  

44         if (convertView == null) {     

45             convertView = mInflater.inflate(R.layout.grid_item, null);     

46             holder = new GridHolder();  

47             holder.appImage = (ImageView)convertView.findViewById(R.id.image_item);  

48             holder.appName = (TextView)convertView.findViewById(R.id.text_item);  

49             convertView.setTag(holder);     

50   

51         }else{  

52              holder = (GridHolder) convertView.getTag();     

53   

54         }  

55         GridInfo info = list.get(index);  

56         if (info != null) {     

57             holder.appName.setText(info.getName());  

58         }  

59         return convertView;  

60     }

61 

62 }

 

比較麻煩還是重寫getView()方法。裡面的GridInfo隻是普通的JAVA bean類。

發佈留言