android组件学习：GridView与SimpleAdapter

【实验目的】
    进步掌握SimpleAdapter类的功能及其使用方法；
掌握GridView通过SimpleAdapter关联到数据的方法。

【实验原理】
1．GridView
    GridView（网格视图）是Android中常用的UI组件之一，它是按照行、列分布的方式来显示多个组件的，通常用于显示图片或图标等。运行的效果如图1所示。

图1
GridView与ListView类似，一般都是通过Adapter来提供显示的数据。
2．GridView通过SimpleAdapter获取数据进行显示的操作步骤
（1）资源建设，也即准备需要的图片；
（2）在主布局文件中添加GridView控件；
（3）建立GridView的item布局文件
（4）程序编码。
在主Activity的java文件中，建立SimpleAdapter对象，并将之与数据、item布局相关联；实现ListView与自定义的Adapter的关联。

【实验步骤】
1．创建新项目
先建立一个空项目，如HelloWorld项目，然后进行以下修改。

2．UI设计
（1）主布局文件
修改主布局文件activity_main.xml，在其中添加GridView组件，并设置其相关属性，具体内容如下。
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp"
    tools:context="com.example.administrator.mygridview.MainActivity">

    <GridView android:id="@+id/gv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:numColumns="2"
        android:verticalSpacing="2dp"
        android:horizontalSpacing="2dp"       />

</LinearLayout>

（2）创建GridView表项布局文件
修改res/layout目录下，新建GridView表项布局文件item.xml，使其内容如下：
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:paddingBottom="4dp"
    >
    <ImageView android:id="@+id/itemImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:adjustViewBounds="true"
        android:maxHeight="220dp"
        android:maxWidth="220dp"
        android:layout_gravity="center_horizontal"
        android:scaleType="fitCenter"
        />

    <TextView android:id="@+id/itemText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/itemImage"
        android:layout_gravity="center"/>
</LinearLayout>

3．资源建设
    因为本应用中要用到一些图片，从网上下载相关图片文件，放到res/drawable文件夹下，在编译时，系统会自动给这些文件每个文件一个ID，ID的格式为：R.drawable.XXX。XXX是对应的文件名。
    本例中，这些图片的文件名分别为：p1.jpg、p2.jpg、p3.jpg、p4.jpg。
4．编写代码
    修改MainActivity.java代码，如下：
package com.example.administrator.mygridview;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.GridView;
import android.widget.SimpleAdapter;
import android.widget.Toast;
import java.util.ArrayList;
import java.util.HashMap;

public class MainActivity extends AppCompatActivity {

    int[] imgIds={R.drawable.p1,R.drawable.p2,
            R.drawable.p3,R.drawable.p4,R.drawable.p5,R.drawable.p6,
            R.drawable.p7,R.drawable.p8};
    String[] names={"费德勒","纳达尔","德约科维奇","穆雷","莎拉波娃","小威","阿扎伦卡","布沙尔"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        GridView gridView=(GridView)findViewById(R.id.gv);

        ArrayList<HashMap<String,Object>> data=new ArrayList<HashMap<String,Object>>();
        for(int i=0; i<names.length; i++){
            HashMap<String,Object> map=new HashMap<String,Object>();
            map.put("image",imgIds[i]);
            map.put("text",names[i]);
            data.add(map);
        }

        SimpleAdapter myAdapter=new SimpleAdapter(this,data,R.layout.item,new String[]{"image","text"},new int[]{R.id.itemImage,R.id.itemText});
        gridView.setAdapter(myAdapter);

        gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            public void onItemClick(AdapterView<?> parent, View v, int position, long id)
            {
                Toast.makeText(MainActivity.this, "你选择了" + (position + 1) + " 号图片"+names[position], Toast.LENGTH_SHORT).show();
            }
        });

    }
}
程序说明：
（1）数据数组
  int[] imgIds={R.drawable.p1,R.drawable.p2,
            R.drawable.p3,R.drawable.p4,R.drawable.p5,R.drawable.p6,
            R.drawable.p7,R.drawable.p8};
    String[] names={"费德勒","纳达尔","德约科维奇","穆雷","莎拉波娃","小威","阿扎伦卡","布沙尔"};
（2）将数据放入一个List中
        ArrayList<HashMap<String,Object>> data=new ArrayList<HashMap<String,Object>>();
        for(int i=0; i<names.length; i++){
            HashMap<String,Object> map=new HashMap<String,Object>();
            map.put("image",imgIds[i]);
            map.put("text",names[i]);
            data.add(map);
        }
（3）建立一个SimpleAdapter对象
SimpleAdapter myAdapter=new SimpleAdapter(this,
                data,
                R.layout.item,
                new String[]{"image","text"},
                new int[]{R.id.itemImage,R.id.itemText});
请注意SimpleAdapter的五个参数的含义，特别是最后两个参数之间的对应关系。
（4）获取GridView对象，并将其关联到SimpleAdapter对象。
GridView gridView=(GridView)findViewById(R.id.gv);
        gridView.setAdapter(myAdapter);
（5）点击事件监听与处理
gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            public void onItemClick(AdapterView<?> parent, View v, int position, long id)
            {
                Toast.makeText(MainActivity.this, "你选择了" + (position + 1) + " 号图片"+names[position], Toast.LENGTH_SHORT).show();
            }
        });

5．验证效果
运行，便会出现如图1的效果。