天天看點

使用SimpleAdapter實作的GridView(九宮格)布局

今天利用了一點點時間寫了一個最簡單的demo,那就是用SimpleAdapter實作的GridView(九宮格)布局。廢話不多說先看一下實作的效果

使用SimpleAdapter實作的GridView(九宮格)布局

類似于上一期講過的ListView布局原理,首先建立兩個布局檔案一個是GridView容器

activity_main.xml

<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <GridView
        android:id="@+id/gridview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" 
        	android:numColumns="auto_fit"/>

</RelativeLayout>
           

gridview_item.xml

<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <ImageView
        android:id="@+id/imageview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <TextView
        android:id="@+id/textvew1"
        android:layout_width="match_parent"
        android:layout_height="match_parent"        
        android:layout_below="@id/imageview" />

</RelativeLayout>
           

下面是代碼部分,注解寫的很詳細了。

package com.icedcap.gridviewtest;

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

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.View;
import android.widget.AdapterView;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.SimpleAdapter;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity {

	private GridView gv;
	private ImageView iv;
	private TextView tv;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		initView();
		List<HashMap<String, Object>> gridItemList = new ArrayList<HashMap<String, Object>>();
		for (int i = 0; i < 10; i++) {
			HashMap<String, Object> gridItem = new HashMap<String, Object>();
			gridItem.put("itemImage", R.drawable.ic_launcher);
			gridItem.put("itemText", ("NO." + String.valueOf(i)));
			gridItemList.add(gridItem);
		}

		SimpleAdapter simpleAdapter = new SimpleAdapter(this, //即要添加的context
				gridItemList,//即要添加的内容源代碼給出的參數類型為List<? extends Map<String, ?>>
				R.layout.gridview_item,//resource Resource identifier of a view layout that defines the views for this list item.
				new String[] { "itemImage", "itemText" },//雨下一個參數所對應的,添加資源的,數組容器,源代碼給出的參數String[] from
				new int[] { R.id.imageview, R.id.textvew1 });//添加資源到具體控件上的位置,數組容器,源代碼給出的參數int[] to 

		// 添加adapter
		gv.setAdapter(simpleAdapter);
		//設定GridView一行所容納的個數
		gv.setNumColumns(4);

		// 給gv添加監聽器
		gv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
			@Override
			public void onItemClick(AdapterView<?> parent, View view,
					int position, long id) {
				HashMap<String, Object> item = (HashMap<String, Object>) parent
						.getItemAtPosition(position);
				Toast.makeText(MainActivity.this,
						"您點選了" + item.get("itemText"), Toast.LENGTH_LONG)
						.show();
			}

		});
	}

	private void initView() {
		gv = (GridView) findViewById(R.id.gridview);
		iv = (ImageView) findViewById(R.id.imageview);
		tv = (TextView) findViewById(R.id.textvew1);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
		return true;
	}

}
           

最後是源代碼的下載下傳位址: http://download.csdn.net/detail/icedcap/6982917