第39章、网格视图GridView（从零开始学Android）

网格视图对于需要有类似“九宫格”布局时非常有用。

 

一、设计界面

　　1、打开“res/layout/activity_main.xml”文件。

　　从工具栏向activity拖出1个GridView网格视图。

　　

　　2、打开activity_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="match_parent"       android:layout_height="match_parent"      android:numColumns="auto_fit"      android:verticalSpacing="10dp"      android:horizontalSpacing="10dp"      android:columnWidth="90dp"      android:stretchMode="columnWidth"      android:gravity="center"  /> 

 

　　3、添加grid.xml文件。

　　

　　4、打开activity_main.xml文件。

　　代码如下：

<?xml version="1.0" encoding="utf-8"?>  <RelativeLayout            xmlns:android="http://schemas.android.com/apk/res/android"            android:layout_height="wrap_content"            android:paddingBottom="4dip" android:layout_width="fill_parent">           <ImageView                  android:layout_height="wrap_content"                  android:id="@+id/ItemImage"                  android:layout_width="wrap_content"                  android:layout_centerHorizontal="true">            </ImageView>           <TextView                  android:layout_width="wrap_content"                  android:layout_below="@+id/ItemImage"                  android:layout_height="wrap_content"                  android:text="TextView01"                  android:layout_centerHorizontal="true"                  android:id="@+id/ItemText">           </TextView>  </RelativeLayout>  

 

二、打开“src/com.genwoxue.gridview/MainActivity.java”文件。

　　然后输入以下代码：

package com.genwoxue.gridview;import android.app.Activity;import android.os.Bundle;import android.view.View;import android.widget.GridView;import android.widget.SimpleAdapter;import java.util.ArrayList;import java.util.HashMap;import android.widget.AdapterView;import android.widget.AdapterView.OnItemClickListener;public class MainActivity extends Activity {@Overridepublic void onCreate(Bundle savedInstanceState) {       super.onCreate(savedInstanceState);       setContentView(R.layout.activity_main);       GridView gridview = (GridView) findViewById(R.id.gridview);               //生成动态数组，并且转入数据        ArrayList<HashMap<String, Object>> lstImageItem = new ArrayList<HashMap<String, Object>>();       for(int i=0;i<10;i++){          HashMap<String, Object> map = new HashMap<String, Object>();          map.put("ItemImage", R.drawable.ic_launcher);//添加图像资源的ID           map.put("ItemText", "NO."+String.valueOf(i));//按序号做ItemText           lstImageItem.add(map);        }        //生成适配器的ImageItem <====> 动态数组的元素，两者一一对应         SimpleAdapter saImageItems = new SimpleAdapter(this,                                                 lstImageItem,//数据来源                                                    R.layout.grid,//grid的XML实现                                                                                                     //动态数组与ImageItem对应的子项                                                           new String[] {"ItemImage","ItemText"},                                                                                                     //ImageItem的XML文件里面的一个ImageView,两个TextView ID                                                   new int[] {R.id.ItemImage,R.id.ItemText});        //添加并且显示         gridview.setAdapter(saImageItems);        //添加消息处理         gridview.setOnItemClickListener(new ItemClickListener());    }        //当AdapterView被单击(触摸屏或者键盘)，则返回的Item单击事件     class  ItemClickListener implements OnItemClickListener{    public void onItemClick(AdapterView<?> arg0,View arg1,int arg2,long arg3){      HashMap<String, Object> item=(HashMap<String, Object>) arg0.getItemAtPosition(arg2);      //显示所选Item的ItemText       setTitle((String)item.get("ItemText"));    }          }  }

三、运行结果

　　

      （本篇来源于网络）