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