GridView是一个表格控件，可以在每个单元格中显示自定义的View或者字符串。在这里我们要实现一个图标下方有文字的效果。
1、首先我们应自定义布局文件image_text.xml。代码如下：
1 <?xml version="1.0" encoding="utf-8"?> 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 3 android:layout_width="match_parent" 4 android:layout_height="match_parent" 5 android:orientation="vertical" > 6 7 <ImageView 8 android:id="@+id/imageview" 9 android:layout_height="wrap_content" 10 android:layout_width="wrap_content" 11 android:src="@drawable/a0" 12 /> 13 <TextView 14 android:id="@+id/textview" 15 android:layout_height="wrap_content" 16 android:layout_width="wrap_content" 17 android:text="textView"/> 18 </LinearLayout>
2、写一个实体类用来存放单元格里面每个视图的图片资源和文字：
1 public class EachIcon { 2 3 private int imageSrcId; 4 private String iconString; 5 6 public EachIcon(int imageSrcId,String iconString) 7 { 8 super(); 9 this.imageSrcId = imageSrcId; 10 this.iconString = iconString; 11 } 12 public int getImageSrcId() 13 { 14 return imageSrcId; 15 } 16 17 public void setImageSrcId(int imageSrcId) 18 { 19 this.imageSrcId = imageSrcId; 20 } 21 22 public String getIconString () 23 { 24 return iconString; 25 } 26 27 public void setIconString(String iconString) 28 { 29 this.iconString = iconString; 30 } 31 }
3、第三步我们还需要自定义一个适配器，名称为ImageAdapter，代码如下：
1 import java.util.ArrayList; 2 import java.util.List; 3 import android.app.Activity; 4 import android.content.Context; 5 import android.util.Log; 6 import android.view.LayoutInflater; 7 import android.view.View; 8 import android.view.ViewGroup; 9 import android.widget.BaseAdapter; 10 import android.widget.ImageView; 11 import android.widget.TextView; 12 13 public class ImageAdapter extends BaseAdapter { 14 private List<EachIcon> eachIconList = new ArrayList(); 15 private Context context; 16 17 public ImageAdapter(Context context) 18 { 19 super(); 20 this.context = context; 21 22 EachIcon e1 = new EachIcon(R.drawable.a0,"图标1"); 23 EachIcon e2 = new EachIcon(R.drawable.a1,"图标2"); 24 EachIcon e3 = new EachIcon(R.drawable.a2,"图标3"); 25 EachIcon e4 = new EachIcon(R.drawable.a3,"图标4"); 26 EachIcon e5 = new EachIcon(R.drawable.a4,"图标5"); 27 EachIcon e6 = new EachIcon(R.drawable.a5,"图标6"); 28 EachIcon e7 = new EachIcon(R.drawable.a6,"图标7"); 29 EachIcon e8 = new EachIcon(R.drawable.a7,"图标8"); 30 EachIcon e9 = new EachIcon(R.drawable.a8,"图标9"); 31 EachIcon e10 = new EachIcon(R.drawable.a9,"图标10"); 32 EachIcon e11 = new EachIcon(R.drawable.a10,"图标11"); 33 EachIcon e12 = new EachIcon(R.drawable.a11,"图标12"); 34 EachIcon e13 = new EachIcon(R.drawable.a12,"图标13"); 35 EachIcon e14 = new EachIcon(R.drawable.a13,"图标14"); 36 EachIcon e15 = new EachIcon(R.drawable.a14,"图标15"); 37 EachIcon e16 = new EachIcon(R.drawable.a15,"图标16"); 38 EachIcon e17 = new EachIcon(R.drawable.a16,"图标17"); 39 40 eachIconList.add(e1); 41 eachIconList.add(e2); 42 eachIconList.add(e3); 43 eachIconList.add(e4); 44 eachIconList.add(e5); 45 eachIconList.add(e6); 46 eachIconList.add(e7); 47 eachIconList.add(e8); 48 eachIconList.add(e9); 49 eachIconList.add(e10); 50 eachIconList.add(e11); 51 eachIconList.add(e12); 52 eachIconList.add(e13); 53 eachIconList.add(e14); 54 eachIconList.add(e15); 55 eachIconList.add(e16); 56 eachIconList.add(e17); 57 } 58 59 @Override 60 public int getCount() { 61 // TODO Auto-generated method stub 62 return eachIconList.size(); 63 } 64 65 @Override 66 public Object getItem(int arg0) { 67 // TODO Auto-generated method stub 68 return null; 69 } 70 71 @Override 72 public long getItemId(int position) { 73 // TODO Auto-generated method stub 74 return 0; 75 } 76 77 @Override 78 public View getView(int position, View convertView, ViewGroup parent) { 79 // TODO Auto-generated method stub 80 Log.v("rub","---------------------------"); 81 82 LayoutInflater inflater = ((Activity)context).getLayoutInflater(); 83 View imgss = inflater.inflate(R.layout.image_text,null); 84 85 ImageView ivimgss = (ImageView)imgss.findViewById(R.id.imageview); 86 TextView tvimgss = (TextView)imgss.findViewById(R.id.textview); 87 88 ivimgss.setImageResource(eachIconList.get(position).getImageSrcId()); 89 tvimgss.setText(eachIconList.get(position).getIconString()); 90 return imgss; 91 } 92 }
4、第四步在Activity里面绑定GridView:
1 import android.app.Activity; 2 import android.os.Bundle; 3 import android.util.Log; 4 import android.view.View; 5 import android.widget.AdapterView; 6 import android.widget.AdapterView.OnItemClickListener; 7 import android.widget.GridView; 8 import android.widget.ListAdapter; 9 import android.widget.TextView; 10 11 public class MainActivity extends Activity { 12 13 @Override 14 protected void onCreate(Bundle savedInstanceState) { 15 super.onCreate(savedInstanceState); 16 setContentView(R.layout.activity_main); 17 18 ListAdapter adapter = new ImageAdapter(this); 19 GridView gv = (GridView)this.findViewById(R.id.gridview); 20 21 gv.setAdapter(adapter); 22 gv.setOnItemClickListener(new OnItemClickListener() { 23 @Override 24 public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, 25 long arg3) { 26 // TODO Auto-generated method stub 27 Log.v("------------------单击的索引值：", ""+((TextView)arg1.findViewById(R.id.textview)) 28 .getText().toString()+"索引是："+arg2); 29 } 30 }); 31 } 32 }
这样一个自定义的视图加文字描述的GridView(表格控件)就完成了。对了，还有主布局文件：
1 <RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin" 6 android:paddingLeft="@dimen/activity_horizontal_margin" 7 android:paddingRight="@dimen/activity_horizontal_margin" 8 android:paddingTop="@dimen/activity_vertical_margin" 9 tools:context=".MainActivity" > 10 11 <GridView 12 android:id="@+id/gridview" 13 android:layout_height="wrap_content" 14 android:layout_width="wrap_content" 15 android:numColumns="4" 16 android:horizontalSpacing="5px" 17 android:verticalSpacing="5px" 18 ></GridView> 19 20 </RelativeLayout>
写下来了以备自己忘记。
下载地址：http://files.cnblogs.com/Jett/gridview.rar