【Android-GridView控件】 九宮格

效果圖：

 

一、主界面佈局 activity_main.xml

   GridView的三種屬性：

android:numColumns="" 每一行顯示多少列

android:horizontalSpacing="" 兩列之間的距離

android:verticalSpacing="" 兩行之間的距離

其中，android:numColumns="auto_fit" 將實現自動適配的效果

但實際上可能很差看，仍是應該人爲規定有多少列數，同時修改ImageButton的大小，將原來的warp_content改爲60dp。

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <GridView
        android:id="@+id/gridview"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:gravity="center"
        android:columnWidth="60dp"
        android:horizontalSpacing="10dp"
        android:numColumns="3"
        android:stretchMode="columnWidth"
        android:verticalSpacing="30dp" >
    </GridView>

</LinearLayout>

 

二、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" >
     <ImageView
        android:id="@+id/image"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center" />

    <TextView
        android:id="@+id/text"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="center" />
</LinearLayout>

 

三、把圖片資源文件放到drawable文件夾下

四、MainActivity.java

1）準備數據源

2）新建適配器SimpleAdapter

3）GridView加載適配器

4）GridView配置監聽器 OnItemClickListener

package com.example.net;

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

import android.app.Activity;
import android.graphics.Color;
import android.graphics.drawable.ColorDrawable;
import android.os.Bundle;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.GridView;
import android.widget.SimpleAdapter;
import android.widget.Toast;

public class MainActivity extends Activity {

    private GridView mGridView;
    // 定義圖標數組
    private int[] imageRes = { R.drawable.calculator, R.drawable.calendar, R.drawable.contact, R.drawable.maps, R.drawable.music, R.drawable.notes, R.drawable.photos, R.drawable.telepon,
            R.drawable.twitter, R.drawable.youtube };
    // 定義標題數組
    private String[] itemName = { "計算器", "日曆", "聯繫人", "地圖", "音樂", "記事本", "圖庫", "電話", "twitter", "youtube" };

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        this.requestWindowFeature(Window.FEATURE_NO_TITLE); // 設置Activity標題不顯示
        this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN); // 設置全屏顯示
        setContentView(R.layout.activity_main);

        mGridView = (GridView) findViewById(R.id.gridview);
        mGridView.setSelector(new ColorDrawable(Color.TRANSPARENT)); // 設置點擊GridView的背景色爲透明

        List<HashMap<String, Object>> data = new ArrayList<HashMap<String, Object>>();
        int length = itemName.length;
        for (int i = 0; i < length; i++) {
            HashMap<String, Object> map = new HashMap<String, Object>();
            map.put("image", imageRes[i]);
            map.put("text", itemName[i]);
            data.add(map);
        }
        // 爲item.xml添加適配器
        SimpleAdapter simpleAdapter = new SimpleAdapter(MainActivity.this, data, R.layout.item, new String[] { "image", "text" }, new int[] { R.id.image, R.id.text });
        mGridView.setAdapter(simpleAdapter);
        // 爲mGridView添加點擊事件監聽器
        mGridView.setOnItemClickListener(new GridViewItemOnClick());
    }

    // 定義點擊事件監聽器
    public class GridViewItemOnClick implements OnItemClickListener {
        @Override
        public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
            Toast.makeText(getApplicationContext(), "我是" + itemName[position], Toast.LENGTH_SHORT).show();
        }
    }
}