Android GridView(网格视图)，见名知义，GridView 就是像表格一样显示数据

GridView(网格视图) 与前面学过的 GridLayout 网格视图不一样的地方，前者是用来显示数据的，后者是用来布局的

GridView

GridView 和 ListView 一样是 AbsListView 的子类，很多东西和 ListView 都是相通的

下面的代码创建一个三列的网格视图

<GridView
    android:id="@+id/gridview"
    android:layout_width="match_marent" 
    android:layout_height="wrap_content"
    android:numColumns="3" />

GridView 属性

废话不多说，我们先来看看范例的效果

1. 创建一个 空的 Android 项目 cn.twle.android.GridView

2. 下载 /static/i/android/gridview.zip 解压并把所有的图片拖到 res/drawable 目录

3. 新建一个包 cn.twle.android.common 然后下载 /static/i/android/MsAdapter.java 放到该目录下

4. 修改 activity_main.xml 添加一个列表

   <?xml version="1.0" encoding="utf-8" ?>
   <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
       xmlns:tools="http://schemas.android.com/tools"
       android:padding="5dp"
       android:layout_width="match_parent"
       android:layout_height="match_parent" >
   
       <GridView
           android:id="@+id/gridview"
           android:layout_width="match_parent" 
           android:layout_height="wrap_content"
           android:numColumns="3" />
   
   </RelativeLayout>
   

5. 接下来添加 GridView 的 item 的布局， 在 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:padding="5dp">
   
       <ImageView
           android:id="@+id/icon"
           android:layout_width="match_parent"
           android:layout_height="32dp"
           android:layout_centerInParent="true"
           android:src="@drawable/a1" />
   
       <TextView
           android:id="@+id/name"
           android:layout_width="match_parent"
           android:layout_height="wrap_content"
           android:gravity="center_horizontal"
           android:text="工人"
           android:textSize="18sp" />
   
   </LinearLayout>
   

6. 然后在 MainActivity.java 相同目录下创建一个 PersonBean.java

   package cn.twle.android.gridview;
   
   public class PersonBean {
   
       private int icon;
       private String name;
   
       public PersonBean() {}
   
       public PersonBean(int icon, String name) {
   
           this.icon = icon;
           this.name = name;
       }
   
       public int getIcon() {
           return icon;
       }
   
       public String getName() {
           return name;
       }
   
       public void setIcon (int icon) {
           this.icon = icon;
       }
   
       public void setName(String name) {
           this.name = name;
       }
   }
   

7. 修改 MainActivity.java 添加数据

   package cn.twle.android.gridview;
   
   import cn.twle.android.common.MsAdapter;
   import android.content.Context;
   import android.os.Bundle;
   import android.support.v7.app.AppCompatActivity;
   import android.view.View;
   import android.widget.AdapterView;
   import android.widget.GridView;
   import android.widget.Toast;
   
   import java.util.ArrayList;
   
   public class MainActivity extends AppCompatActivity {
   
       private Context mContext;
       private GridView gridview;
       private MsAdapter mAdapter = null;
       private ArrayList<PersonBean> mData = null;
   
       @Override
       protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(R.layout.activity_main);
   
           mContext = MainActivity.this;
   
           gridview = (GridView) findViewById(R.id.gridview);
   
           mData = new ArrayList<PersonBean>();
           mData.add(new PersonBean(R.drawable.a1, "工人"));
           mData.add(new PersonBean(R.drawable.a2, "快递"));
           mData.add(new PersonBean(R.drawable.a3, "老奶奶"));
           mData.add(new PersonBean(R.drawable.a4, "机器人"));
           mData.add(new PersonBean(R.drawable.a5, "技术"));
           mData.add(new PersonBean(R.drawable.a6, "护士"));
           mData.add(new PersonBean(R.drawable.a7, "民族"));
           mData.add(new PersonBean(R.drawable.a8, "警察"));
           mData.add(new PersonBean(R.drawable.a9, "服务员"));
   
           mAdapter = new MsAdapter<PersonBean>(mData, R.layout.gridview_item) {
               @Override
               public void bindView(ViewHolder holder, PersonBean obj) {
   
                   holder.setImageResource(R.id.icon, obj.getIcon());
                   holder.setText(R.id.name, obj.getName());
               }
           };
   
           gridview.setAdapter(mAdapter);
   
           gridview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
               @Override
               public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                   Toast.makeText(mContext, "你点击了~" + position + "~项", Toast.LENGTH_SHORT).show();
               }
           });
   
       }
   
   }