Android学习日记16--GridView(网格视图)

一、GridView

1、简述　　

GridView按照行列来显示图片或文本的一种视图，排列其实有点类似TableLayout布局，不过和TableLayout还是差别很大的,倒比较像二维的ListView。位于android.widget包下，常常用来实现类似九宫格的图像。实现手法和ListView有点相似，用Apapter把数据绑定到控件上，为容器提供子视图，利用视图的数据和元数据来构建每个子视图自定义Adapter显示。

如果需要自定义适配器可以扩展抽象类BaseAdapter。

2、常用属性和对应方法如下：

下面用实例化SimpleAdapter和继承抽象类BaseAdapter方法实现下图的例子：

3、实例化SimpleAdapter实现

Activity代码：

private GridView gv;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
       // TODO Auto-generated method stub 
       super.onCreate(savedInstanceState);
       setContentView(R.layout.gridview);

       //准备要添加的数据条目 
       List<Map<String, Object>> items = new ArrayList<Map<String,Object>>();
       for (int i = 0; i < 9; i++) {
         Map<String, Object> item = new HashMap<String, Object>();
         item.put("imageItem", R.drawable.ic_launcher);//添加图像资源的ID   
         item.put("textItem", "icon" + i);//按序号添加ItemText   
         items.add(item);
       }

      //实例化SimpleAdapter适配器 
       SimpleAdapter adapter = new SimpleAdapter(this,
                                                   items,
                                                   R.layout.grid_item,
                                                   new String[]{"imageItem", "textItem"},
                                                   new int[]{R.id.image_item, R.id.text_item});


       //获得GridView实例 
       gv = (GridView)findViewById(R.id.mygridview);
       //为GridView设置适配器 
       gv.setAdapter(adapter);

    }

单个组件XML:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:id="@+id/RelativeLayout1"
   android:layout_width="wrap_content"
   android:layout_height="fill_parent"
   android:paddingBottom="6dip"
   >
   <ImageView
      android:id="@+id/image_item"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_centerHorizontal="true"
      android:src="@drawable/ic_launcher"
      />
   <TextView
      android:id="@+id/text_item"
      android:layout_below="@+id/image_item"
      android:layout_height="wrap_content"
      android:layout_width="wrap_content"
      android:layout_centerHorizontal="true"
      />
</RelativeLayout>

页面主布局XML：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   >
   <GridView
      android:id="@+id/mygridview"
      android:numColumns="3"
      android:gravity="center_horizontal"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:stretchMode="columnWidth"
      />
</LinearLayout>

4、继承抽象类BaseAdapter实现

替换成自己GridAdapter代码：

//       //准备要添加的数据条目 
//       List<Map<String, Object>> items = new ArrayList<Map<String,Object>>(); 
//       for (int i = 0; i < 9; i++) { 
//         Map<String, Object> item = new HashMap<String, Object>(); 
//         item.put("imageItem", R.drawable.ic_launcher);//添加图像资源的ID   
//         item.put("textItem", "icon" + i);//按序号添加ItemText   
//         items.add(item); 
//       } 
//
//      //实例化SimpleAdapter适配器 
//       SimpleAdapter adapter = new SimpleAdapter(this,  
//                                                   items,  
//                                                   R.layout.grid_item,  
//                                                   new String[]{"imageItem", "textItem"},  
//                                                   new int[]{R.id.image_item, R.id.text_item}); 


      List<GridInfo> list = new ArrayList<GridInfo>();
       for (int i = 0; i < 9; i++) {
           list.add(new GridInfo("icon"+i));
       }

       GridAdapter adapter = new GridAdapter(this);
       adapter.setList(list);

补上GridAdapter代码：

public class GridAdapter extends BaseAdapter {

    private class GridHolder {
        ImageView appImage;
        TextView appName;
    }

    private Context context;

    private List<GridInfo> list;
    private LayoutInflater mInflater;

    public GridAdapter(Context c) {
        super();
        this.context = c;
    }

    public void setList(List<GridInfo> list) {
        this.list = list;
        mInflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

    }

    public int getCount() {
        // TODO Auto-generated method stub  
        return list.size();
    }

    @Override
    public Object getItem(int index) {

        return list.get(index);
    }

    @Override
    public long getItemId(int index) {
        return index;
    }

    @Override
    public View getView(int index, View convertView, ViewGroup parent) {
        GridHolder holder;
        if (convertView == null) {
            convertView = mInflater.inflate(R.layout.grid_item, null);
            holder = new GridHolder();
            holder.appImage = (ImageView)convertView.findViewById(R.id.image_item);
            holder.appName = (TextView)convertView.findViewById(R.id.text_item);
            convertView.setTag(holder);

        }else{
             holder = (GridHolder) convertView.getTag();

        }
        GridInfo info = list.get(index);
        if (info != null) {
            holder.appName.setText(info.getName());
        }
        return convertView;
    }

}

比较麻烦还是重写getView()方法。里面的GridInfo只是普通的JAVA bean类。

Chendd's Blog

世界上没有什么事情是一行代码不能解决的。如果有，那就两行。