创建Gridview视图

细想自己接触android也有一个月了，一直想写blog来敦促自己的进步，供自己之后翻阅，同时想着自己在编写例子的时候会出现各种问题，所以创建blog来记录自己的学习进程，也可以作分享之用。好了，废话不多说了，这篇blog主要是讲解的如何创建gridview的视图。如下图效果所示：

要实现图中的功能，

先介绍gridview几个属性：

GridView的一些属性

android:numColumns="auto_fit"- - - - - 列数设置为自动

android:columnWidth="90dp"- -  - - -每列的宽度，也就是item的宽度

android:stretchMode="columnWidth"- -  - - -缩放与列宽大小同步

android:verticalSpacing ="10dp"- - -  - - -垂直边距

android:horizontalSpacing="10dp"- - - -  - -水平边距

第一步：将案例所需的四个图片（注意名字一定要是英文）copy到res/drawable文件夹下。

 

第二步：在main_activity中添加一个gridview，其中布局代码如下

<span style="font-size:18px;"><?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:orientation="vertical"
android:background="#000"
tools:context="com.example.amos.gridviewdemo.MainActivity">

    <GridView
android:id="@+id/gview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:numColumns="auto_fit"<span style="white-space:pre">			</span>//列数设置为自动
android:columnWidth="80dp"
android:stretchMode="columnWidth"><span style="white-space:pre">		</span>//将拉伸模式调整跟宽度一样

    </GridView>
</LinearLayout></span>

第三步：因为所做效果图中每个item项中都有一个imageiew和textview的控件，所以我们要单独创建一个item的布局以便传入gridview中。

<?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"
android:orientation="vertical"<span style="white-space:pre">		</span>//这一项的作用是让imageview控件和textview控件在竖直方向对齐
android:gravity="center"
android:padding="10dp">

    <ImageView
android:src="#9932CC"
android:id="@+id/image"
android:layout_width="60dp"
android:layout_height="60dp" />

    <TextView
android:id="@+id/text"
android:layout_marginTop="5dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#ffffff"
android:text="文字"/>
</LinearLayout>

第四步：接着就是最关键的在MainActivity中填写代码。主要分为a.准备数据源 b.新建适配器 c.配置适配器

</pre><pre name="code" class="java">import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.GridView;
import android.widget.SimpleAdapter;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

public class MainActivity extends Activity {

    private GridView gview;
    private List<Map<String, Object>> data_list;
    private SimpleAdapter sim_adapter;
    private int[] icon = {R.drawable.sns_qqfriends_icon, R.drawable.sns_sina_icon,
            R.drawable.sns_weixin_icon, R.drawable.sns_weixin_timeline_icon};
    private String[] iconName = {"QQ", "Sina", "Weixin", "SNS"};


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        gview = (GridView) findViewById(R.id.gview);
        //新建List
        data_list = new ArrayList<Map<String, Object>>();
        //获取数据
        getData();
        //新建适配器
        String[] from = {"image", "text"};
        int[] to = {R.id.image, R.id.text};
        sim_adapter = new SimpleAdapter(this, data_list, R.layout.item, from, to);
        //配置适配器
        gview.setAdapter(sim_adapter);
      
    }

    public List<Map<String, Object>> getData() {
//icon和iconName的长度是相同的，这里任选其一就可以
        for (int i = 0; i < icon.length; i++) {
            Map<String, Object> map = new HashMap<String, Object>();
            map.put("image", icon[i]);
            map.put("text", iconName[i]);
            data_list.add(map);
        }

        return data_list;
    }

}

关于setadapter的用法，可以参见官方的API文档，里面的解释是这样的。

public void setAdapter (ListAdapter adapter) 

 Sets the data behind this GridView. 

 Parameters 

adapter the adapter providing the grid's data

好了，结束，这样就可以直接运行了。

最后，拓展一下，比如现在我有这个图标了，那我怎么样去点击图标，然后让他有效果呢，这种情况下，我们可以插入一个

setOnItemClickListener（）的方法。那么现在我们在java代码文件夹下创建两个activity，如下图（这是我随意创建的，目的只是让他有东西能显示）

那么接着在Main_Activity中添加setOnItemClickListener方法，这里我只添加了两个点击事件，如下示：

 gview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {

                //在这里处理每一个item的单击事件
                switch (position){
                    case 0:
                        startActivity(new Intent(MainActivity.this,AnotherAty.class));
                        break;
                    case 1:
                        startActivity(new Intent(MainActivity.this,LoginActivity.class));
                        break;
                    default:
                        break;

                }

            }
        });

最后，附上我的源码

点击打开链接