(android) 在GridView中实现单选或多选功能

时间:2023-02-08 18:50:15

          最近在做项目的过程中,要用到GridView,同时还得使用单选或多选功能,在网上搜过很多资源贴,但都不是我想要的效果,于是就自行设计了一种方案。什么都不说,先上个效果图^_^: Demo源代码下载:http://download.csdn.net/down/3435752/anndaming

(android) 在GridView中实现单选或多选功能

首先需要构建一个ImageAdapter类,此类继承了BaseAdapter类,用于做GridView中资源的适配器,代码如下:

package com.demo;

import java.util.Vector;

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.graphics.drawable.LayerDrawable;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;

public class ImageAdapter extends BaseAdapter{    
    private Context mContext;			// 定义Context
    private Vector<Integer> mImageIds = new Vector<Integer>();	// 定义一个向量作为图片源
    private Vector<Boolean> mImage_bs = new Vector<Boolean>();	// 定义一个向量作为选中与否容器
    
    private int lastPosition = -1;		//记录上一次选中的图片位置,-1表示未选中任何图片
    private boolean multiChoose;		//表示当前适配器是否允许多选
    
    public ImageAdapter(Context c, boolean isMulti){
    	mContext = c;
    	multiChoose = isMulti;
    	
    	// 装入资源 
    	mImageIds.add(R.drawable.item1);
    	mImageIds.add(R.drawable.item2);
    	mImageIds.add(R.drawable.item3);
    	mImageIds.add(R.drawable.item4);
    	mImageIds.add(R.drawable.item5);
    	for(int i=0; i<5; i++)
    		mImage_bs.add(false);
    }
    
	@Override
	public int getCount() {
		// TODO Auto-generated method stub
		return mImageIds.size();
	}

	@Override
	public Object getItem(int position) {
		// TODO Auto-generated method stub
		return position;
	}

	@Override
	public long getItemId(int position) {
		// TODO Auto-generated method stub
		 return position;
	}

	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		// TODO Auto-generated method stub
		ImageView imageView;
        if (convertView == null)
        {
            imageView = new ImageView(mContext);		// 给ImageView设置资源
            imageView.setLayoutParams(new GridView.LayoutParams(50, 50));	// 设置布局图片
            imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);		// 设置显示比例类型
        }
        else
        {
            imageView = (ImageView) convertView;
        }
        imageView.setImageDrawable(makeBmp(mImageIds.elementAt(position),
        		mImage_bs.elementAt(position)));
        
        return imageView;
	}
	
	private LayerDrawable makeBmp(int id, boolean isChosen){
		Bitmap mainBmp = ((BitmapDrawable)mContext.getResources().getDrawable(id)).getBitmap();
		
		// 根据isChosen来选取对勾的图片
    	Bitmap seletedBmp;
    	if(isChosen == true)
    		seletedBmp = BitmapFactory.decodeResource(mContext.getResources(),
    				R.drawable.btncheck_yes);
    	else
    		seletedBmp = BitmapFactory.decodeResource(mContext.getResources(),
    				R.drawable.btncheck_no);
    	
    	// 产生叠加图
    	Drawable[] array = new Drawable[2];
    	array[0] = new BitmapDrawable(mainBmp);
    	array[1] = new BitmapDrawable(seletedBmp);
    	LayerDrawable la = new LayerDrawable(array);
    	la.setLayerInset(0, 0, 0, 0, 0);
    	la.setLayerInset(1, 0, -5, 60, 45 );
    	 
    	return la;	//返回叠加后的图
    }

	// 修改选中的状态
    public void changeState(int position){
    	// 多选时
    	if(multiChoose == true){	
    		mImage_bs.setElementAt(!mImage_bs.elementAt(position), position);	//直接取反即可	
    	}
    	// 单选时
    	else{						
	    	if(lastPosition != -1)
	    		mImage_bs.setElementAt(false, lastPosition);	//取消上一次的选中状态
	    	mImage_bs.setElementAt(!mImage_bs.elementAt(position), position);	//直接取反即可
	    	lastPosition = position;		//记录本次选中的位置
    	}
    	notifyDataSetChanged();		//通知适配器进行更新
    }
}

接下是配置main.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    >
	<LinearLayout
    	android:orientation="vertical" 
    	android:layout_width="fill_parent"
		android:layout_height="wrap_content" 
		android:gravity="center_horizontal">
		<TextView 
			android:text="单选功能"
			android:layout_width="fill_parent"
			android:layout_height="wrap_content"
			android:textSize="40dp"
			android:gravity="center"/>
    	<GridView android:id="@+id/gridview_radio"
    		android:layout_width="250dp"
    		android:layout_height="150dp"
    		android:numColumns="4"
    		android:padding="10dp"
    		android:horizontalSpacing="4dp"
    		android:verticalSpacing="4dp"
    		android:gravity="center"/>
    </LinearLayout>	
    
    <LinearLayout
    	android:orientation="vertical" 
    	android:layout_width="fill_parent"
		android:layout_height="wrap_content" 
		android:gravity="center_horizontal">
		<TextView 
			android:text="多选功能"
			android:layout_width="fill_parent"
			android:layout_height="wrap_content"
			android:textSize="40dp"
			android:gravity="center"/>
    	<GridView android:id="@+id/gridview_check"
    		android:layout_width="250dp"
    		android:layout_height="150dp"
    		android:numColumns="4"
    		android:padding="10dp"
    		android:horizontalSpacing="4dp"
    		android:verticalSpacing="4dp"
    		android:gravity="center"/>
    </LinearLayout>	
</LinearLayout>

            最后写一个Activity作测试:

package com.demo;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.GridView;
import android.widget.AdapterView.OnItemClickListener;

public class DemoActivity extends Activity {
	GridView gridView_radio;	//单选宫格
	GridView gridView_check;	//多选宫格
	
	ImageAdapter ia_radio;		//存储图片源的适配器(单选)
	ImageAdapter ia_check;		//存储图片源的适配器(多选)
	
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        // 单选的宫格 
        gridView_radio = (GridView) findViewById(R.id.gridview_radio);
        ia_radio = new ImageAdapter(this, false);
        gridView_radio.setAdapter(ia_radio);
        // 设置点击监听 
        gridView_radio.setOnItemClickListener(new OnItemClickListener() {
			@Override
			public void onItemClick(AdapterView<?> arg0, View arg1,
					int position, long arg3) {
				// TODO Auto-generated method stub
				ia_radio.changeState(position);
			}
		});
        
        // 多选的宫格 
        gridView_check = (GridView) findViewById(R.id.gridview_check);
        ia_check = new ImageAdapter(this, true);
        gridView_check.setAdapter(ia_check);
        // 设置点击监听 
        gridView_check.setOnItemClickListener(new OnItemClickListener() {
			@Override
			public void onItemClick(AdapterView<?> arg0, View arg1,
					int position, long arg3) {
				// TODO Auto-generated method stub
				ia_check.changeState(position);
			}
		});
    }
}