Android--UI之GridView

標籤：slist   table   hashmap   網格   sel   oid   net   tools   子類   

前言

　　這篇部落格介紹一下Android平台下，GridView控制項的開發。針對GridView控制項的一些常用屬性、方法，以及注意事項進行講解，最後將以一個Demo展示GridView控制項的使用。

GridView

　　GridView一個以二維網格的格式展示資料的控制項，它與ListView具有相同的繼承結構，同樣直接繼承與AbsListView，並且使用一個ListAdapter介面的適配器來綁定資料。其實它的展示效果有點類似於TableLayout布局，可以看看另外一篇部落格：Android--UI布局。相信有過UI編程經驗的人，都對GridView這個控制項不會陌生。

　　GridView：

　　對於GridView而言，有一些特定的屬性需要瞭解一下，Android也為這些屬性提供了對應的getter/setter方法：

• android:columnWidth：指定每一列的固定寬度。
• android:gravity：指定每個填充項的填充方向。
• android:horizontalSpacing：指定水平行之間的間距。
• android:verticalSpacing：指定垂直列之間的間距。
• android:numColumns：指定列數。

 　　對於android:numColumns屬性而言，如果設定為1，可以當成一個ListView使用。而GridView的方法與事件，大部分和ListView類似，可以參見另外一篇講解ListView的部落格，這裡不再詳解了。

 資料填充

　　GridView和ListView一樣，都需要通過一個ListAdapter的適配器來填充資料。對於複雜的資料，一般會使用選擇繼承BaseAdapter。對於一些簡單的資料樣式，通過XML布局展示的，可以使用SimpleAdapter。它們都是比較常用的ListAdapter子類。

　　下面通過一個Demo簡單講解一下GridView的使用。

　　布局代碼：

 1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 2     xmlns:tools="http://schemas.android.com/tools" 3     android:layout_width="match_parent" 4     android:layout_height="match_parent" 5     android:orientation="vertical" 6     android:paddingBottom="@dimen/activity_vertical_margin" 7     android:paddingLeft="@dimen/activity_horizontal_margin" 8     android:paddingRight="@dimen/activity_horizontal_margin" 9     android:paddingTop="@dimen/activity_vertical_margin"10     tools:context=".MainActivity" >11 12     <GridView13         android:id="@+id/gridview"14         android:layout_width="match_parent"15         android:layout_height="wrap_content"16         android:horizontalSpacing="6dp"17         android:numColumns="3"        18         android:padding="20dp"19         android:verticalSpacing="6dp" />20 21     <ImageView22         android:id="@+id/iamgeview"23         android:layout_width="match_parent"24         android:layout_height="150dp" />25 26 </LinearLayout>

　　

　　實現代碼：

 1 package com.bgxt.gridviewdemo; 2  3 import java.util.ArrayList; 4 import java.util.HashMap; 5 import java.util.List; 6 import java.util.Map; 7  8 import android.os.Bundle; 9 import android.app.Activity;10 import android.view.Menu;11 import android.view.View;12 import android.widget.AdapterView;13 import android.widget.GridView;14 import android.widget.ImageView;15 import android.widget.SimpleAdapter;16 import android.widget.AdapterView.OnItemClickListener;17 import android.widget.AdapterView.OnItemSelectedListener;18 19 public class MainActivity extends Activity {20 21     private ImageView imageView;22     private int[] resIds = new int[] { R.drawable.bmp1, R.drawable.bmp2,23             R.drawable.bmp3, R.drawable.bmp4, R.drawable.bmp5, R.drawable.bmp6,24             R.drawable.bmp7, R.drawable.bmp8, R.drawable.bmp9, R.drawable.bmp10 };25 26     @Override27     protected void onCreate(Bundle savedInstanceState) {28         super.onCreate(savedInstanceState);29         setContentView(R.layout.activity_main);30         GridView gridView = (GridView) findViewById(R.id.gridview);31         imageView = (ImageView) findViewById(R.id.iamgeview);32         List<Map<String, Object>> list = new ArrayList<Map<String, Object>>();33         for (int i = 0; i < resIds.length; i++) {34             Map<String, Object> cell = new HashMap<String, Object>();35             cell.put("imageview", resIds[i]);36             list.add(cell);37         }38 39         SimpleAdapter simpleAdapter = new SimpleAdapter(MainActivity.this,40                 list, R.layout.cell, new String[] { "imageview" },41                 new int[] { R.id.ivCell });42         gridView.setAdapter(simpleAdapter);43         gridView.setOnItemClickListener(itemClick);44         imageView.setImageResource(resIds[0]);45     }46 47     @Override48     public boolean onCreateOptionsMenu(Menu menu) {49         // Inflate the menu; this adds items to the action bar if it is present.50         getMenuInflater().inflate(R.menu.main, menu);51         return true;52     }53 54     private OnItemClickListener itemClick = new OnItemClickListener() {55 56         @Override57         public void onItemClick(AdapterView<?> parent, View view, int position,58                 long id) {59             // TODO Auto-generated method stub60             imageView.setImageResource(resIds[position]);61         }62     };63 64 }

　　效果展示：

 　　源碼下載

　　請支援原創，尊重原創，轉載請註明出處。謝謝。

Android--UI之GridView