GridView宫格图的施用

GridView宫格图的使用

学习内容：1.GridView的使用

               2.AlertDialog显示框的使用

 

 

1.先在res文件夹的drawable三个文件夹下放入图片

 

2.写布局main.xml

 

   <?xml version="1.0" encoding="utf-8"?>

<AbsoluteLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@+id/widget0"
    >
<GridView
    android:id="@+id/grid"
    android:layout_width="fill_parent"
    android:padding="30dip"
    android:columnWidth="52px"
    android:layout_height="210px"
    android:numColumns="5"
    />   
<ImageView
    android:id="@+id/ImageView_Big"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_x="95px"
    android:layout_y="250px"
    />
  
 </AbsoluteLayout>

 3.工程的Activity内容

     package com.chaowen;

import android.app.Activity;
import android.app.AlertDialog;
import android.app.Dialog;
import android.content.Context;
import android.content.DialogInterface;
import android.content.DialogInterface.OnClickListener;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.AdapterView.OnItemClickListener;

public class gridViewDemo extends Activity implements GridView.OnItemClickListener,GridView.OnItemSelectedListener{
    /** Called when the activity is first created. */
	private GridView my_GridView;
	private ImageAdapter myImageAdapter;
	private ImageView big_ImageView;
	
	
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        my_GridView = (GridView)findViewById(R.id.grid);
        big_ImageView = (ImageView)findViewById(R.id.ImageView_Big);
        
        myImageAdapter = new ImageAdapter(this);
        //为my_GridView设置一个ImageAdapter
        my_GridView.setAdapter(myImageAdapter);
        
        
        /**
         * GridView的图片Items点击事件处理
         */
        my_GridView.setOnItemClickListener(this);
         
        
    }
    
  
    
    private class ImageAdapter extends BaseAdapter{
         //myContext为上下文
    	private Context myContext;
    	//GridView用来加载图片的ImageView
    	private ImageView the_imageView;
    	
    	//这是图片资源ID的数组
    	private Integer[] mImageIds = {R.drawable.a,R.drawable.b,R.drawable.c,
    			R.drawable.d,R.drawable.e,R.drawable.f,R.drawable.g};
    	
    	//构造方法
    	public ImageAdapter(Context myContext){
    		this.myContext = myContext;
    	}
    	//返回资源ID数组的长度
		@Override
		public int getCount() {
			return mImageIds.length;
		}
        
		//得到Items
		@Override
		public Object getItem(int position) {
			return position;
		}
		//得到Items的ID
		@Override
		public long getItemId(int position) {
			return position;
		}
        
		
		//处理gridview的每个Item
		@Override
		public View getView(int position, View convertView, ViewGroup parent) {
			//创建一个ImageView
			the_imageView = new ImageView(myContext);
			//设置图像源于资源ID
			the_imageView.setImageResource(mImageIds[position]);
			//使Imageview与边界适应
			the_imageView.setAdjustViewBounds(true);
			//设置背景图片的风格
			the_imageView.setBackgroundResource(android.R.drawable.picture_frame);
			//返回带有多个图片Id的Imageview
			return the_imageView;

			
		}
    	
		//自定义获取对应位置的图片ID
		public Integer getCheckedImageIDPosition(int index){
			return mImageIds[index];
		}
    }


   //点击GridView中图片Items后显示一个AlterDialog提示框
	@Override
	public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3) {
	    new AlertDialog.Builder(this)
	   .setTitle("图片浏览")
	    //获得对应的图片并显示
	    .setIcon(myImageAdapter.getCheckedImageIDPosition(arg2))
	    //添加一个按钮
	    .setPositiveButton("返回", new OnClickListener(){

			@Override
			public void onClick(DialogInterface dialog, int which) {
				// TODO Auto-generated method stub
				
			}
	    	
	    }).show();
		
	}



	@Override
	public void onItemSelected(AdapterView<?> arg0, View arg1, int arg2,
			long arg3) {
		//GridView中的图片移动焦点选中时，下面的大图ImageView显示相应的大图片
		  big_ImageView.setImageResource(myImageAdapter.getCheckedImageIDPosition(arg2));
		
	}


     //未选中GridView中的图片Items事件处理
	@Override
	public void onNothingSelected(AdapterView<?> arg0) {
		// TODO Auto-generated method stub
		
	}
    
    
    
    
      
}