Android系列课程之九：GridView组件的使用

Android系列教程目录:

1. Android教程之一：Window下搭建Android开发环境

2. Android教程之二：Linux下搭建Android开发环境

3. Android教程之三：第一个Android应用，HelloWorld

4. Android系列教程之四：Android项目的目录结构

5. Android系列教程之五：Activity的生命周期

6. Android系列教程之六：TextView小组件的使用--附带超链接和跑马灯效果

7. Android系列教程之七：EditText使用详解-包含很多教程上看不到的功能演示

8. Android系列教程之八：ListView组件的使用

本文版权归飞雪无情所有，转载请注明出处，永久链接: http://flysnow.iteye.com/blog/890171

我新建了一个Android的技术交流群，群号为86686524? ??120059404，感兴趣的可以申请加入，大家一块学习。

?

1. 新建一个HelloGridView的工程
2. 修改main.xml代码如下：
   

   <?xml version="1.0" encoding="utf-8"?><GridView  xmlns:android="http://schemas.android.com/apk/res/android"  android:id="@+id/gridview"  android:layout_width="fill_parent"  android:layout_height="fill_parent"  android:columnWidth="90dp"  android:numColumns="auto_fit"  android:horizontalSpacing="10dp"  android:verticalSpacing="10dp"  android:stretchMode="columnWidth"  android:gravity="center"></GridView>

   ?很简单，就是一个GridView。设置列宽为90dp,这样当我们的numColumns设置为auto_fit时，Android就会自动计算我们手机屏幕的大小以决定每一行展示几个元素。这是很方便。android:horizontalSpacing定义列之间的间隔，android:verticalSpacing定义行之间的间隔。android:stretchMode设置为columnWidth是意味着根据列宽自动缩放。
3. 修改我们Activity HelloGridView如下：

   /** *  * @author 飞雪无情 * @since 2011-1-20 */public class HelloGridView extends Activity {    /** Called when the activity is first created. */	@Override	protected void onCreate(Bundle savedInstanceState) {		super.onCreate(savedInstanceState);		setContentView(R.layout.main);		GridView gridView=(GridView)findViewById(R.id.gridview);		gridView.setAdapter(new ImageAdapter(this));		//单击GridView元素的响应		gridView.setOnItemClickListener(new OnItemClickListener() {			@Override			public void onItemClick(AdapterView<?> parent, View view,					int position, long id) {				//弹出单击的GridView元素的位置				Toast.makeText(HelloGridView.this,mThumbIds[position], Toast.LENGTH_SHORT).show();			}		});	}	private class ImageAdapter extends BaseAdapter{		private Context mContext;		public ImageAdapter(Context context) {			this.mContext=context;		}		@Override		public int getCount() {			return mThumbIds.length;		}		@Override		public Object getItem(int position) {			return mThumbIds[position];		}		@Override		public long getItemId(int position) {			// TODO Auto-generated method stub			return 0;		}		@Override		public View getView(int position, View convertView, ViewGroup parent) {			//定义一个ImageView,显示在GridView里			ImageView imageView;			if(convertView==null){				imageView=new ImageView(mContext);				imageView.setLayoutParams(new GridView.LayoutParams(85, 85));				imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);	            imageView.setPadding(8, 8, 8, 8);			}else{				imageView = (ImageView) convertView;			}			imageView.setImageResource(mThumbIds[position]);			return imageView;		}					}	//展示图片	private Integer[] mThumbIds = {            R.drawable.sample_2, R.drawable.sample_3,            R.drawable.sample_4, R.drawable.sample_5,            R.drawable.sample_6, R.drawable.sample_7,            R.drawable.sample_0, R.drawable.sample_1,            R.drawable.sample_2, R.drawable.sample_3,            R.drawable.sample_4, R.drawable.sample_5,            R.drawable.sample_6, R.drawable.sample_7,            R.drawable.sample_0, R.drawable.sample_1,            R.drawable.sample_2, R.drawable.sample_3,            R.drawable.sample_4, R.drawable.sample_5,            R.drawable.sample_6, R.drawable.sample_7    };}

   ?这里我们也是采用的自定义Adapter，可以上一节的自定义Adapter讲解。展示了一些图片，然后点击一个图片的时候会显示这个图片所在的位置。
4. 运行程序，效果图如下：
   
   ?