Android网格布局GridView实现漂亮的多选效果

概述上一篇文章中主要讲了GridView的简单应用，以网格的形式展示了一些图片，对于图片也有点击监听 *** 作。但是，如果我们在浏览图片的时候需要一些选中 *** 作、甚至是多选 *** 作的时候。这样的功能我们又该如何实现呢？

上一篇文章中主要讲了GrIDVIEw的简单应用，以网格的形式展示了一些图片，对于图片也有点击监听 *** 作。但是，如果我们在浏览图片的时候需要一些选中 *** 作、甚至是多选 *** 作的时候。这样的功能我们又该如何实现呢？

可以使用Actionbar +GrIDVIEw的形式实现！在谈及具体实现之前，首先我们先了解一下什么是

Actionbar：

 Action bar是活动中的一种控件，用以代替传统的品目顶端的标题栏，它提供了多便利性。有关其详细内容会在以后研究，现在主要考虑上述需求的实现。

先上效果图

首先是关于Actionbar的布局文件：主要是用于实现全选与全不选的功能的。

<?xml version="1.0" enCoding="utf-8"?> <menu xmlns:androID="http://schemas.androID.com/apk/res/androID" >   <item  androID:ID="@+ID/menu_select"  androID:title="@string/select_all"/>  <item  androID:ID="@+ID/menu_unselect"  androID:title="@string/unselect_all"/>  </menu> 

其次是其样式文件：

<?xml version="1.0" enCoding="utf-8"?> <resources>   <!-- 设置Actionbar的样式 -->  <style name="Diytheme" parent="@androID:style/theme.Holo">  <item name="androID:actionModeBackground">@drawable/tab_bg</item>  <item name="androID:actionModeCloseDrawable">@drawable/back</item>  <item name="androID:actionbarStyle">@style/DiyActionbarStyle</item>  </style>   <style name="DiyActionbarStyle" parent="@androID:style/Widget.Holo.Actionbar">  <item name="androID:background">@drawable/tab_bg</item>  </style>  </resources> 

字符资源文件：

<?xml version="1.0" enCoding="utf-8"?> <resources>   <string name="app_name">GrIDVIEw</string>  <string name="selection">选中%s个</string>  <string name="select_all">全选</string>  <string name="unselect_all">全不选</string>  </resources> 

grID_item.xml文件

<?xml version="1.0" enCoding="utf-8"?> <relativeLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  androID:layout_wIDth="fill_parent"  androID:layout_height="fill_parent" >   <ImageVIEw  androID:ID="@+ID/img_vIEw"  androID:layout_wIDth="fill_parent"  androID:layout_height="fill_parent"  androID:scaleType="fitXY" />   <ImageVIEw  androID:ID="@+ID/select"  androID:layout_wIDth="wrap_content"  androID:layout_height="wrap_content"  androID:layout_alignParentRight="true"  androID:layout_alignParenttop="true"  androID:background="@drawable/icon_choice"  androID:visibility="gone" />  <!-- 这里是当该图片被选上的时候打上小勾的,因此起初是隐藏不显示的 --> </relativeLayout> 

main.xml

<?xml version="1.0" enCoding="utf-8"?> <linearLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  androID:layout_wIDth="fill_parent"  androID:layout_height="fill_parent" >   <GrIDVIEw  androID:ID="@+ID/grIDvIEw"  androID:layout_wIDth="fill_parent"  androID:layout_height="wrap_content"  androID:columnWIDth="75dip"  androID:gravity="center"  androID:horizontalSpacing="2dip"  androID:numColumns="4"  androID:verticalSpacing="2dip"  androID:layout_margintop="20dip" />  </linearLayout> 

actionbar_layout.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" >   <TextVIEw  androID:ID="@+ID/action_text"  androID:layout_wIDth="match_parent"  androID:layout_height="wrap_content"  androID:textSize="18sp"  androID:textcolor="@androID:color/white"  androID:layout_gravity="center_vertical" />  </linearLayout> 

GrIDItem.java文件：

package com.kiritor; /**  * @author Kiritor  * 实现自己的VIEw继承Checable接口*/ import androID.content.Context; import androID.util.AttributeSet; import androID.util.Log; import androID.vIEw.LayoutInflater; import androID.vIEw.VIEw; import androID.Widget.Checkable; import androID.Widget.ImageVIEw; import androID.Widget.relativeLayout;  public class GrIDItem extends relativeLayout implements Checkable {   private Context mContext;  private boolean mChecked;//判断该选项是否被选上的标志量  private ImageVIEw mimgVIEw = null;  private ImageVIEw mSecletVIEw = null;   public GrIDItem(Context context) {  this(context,null,0);  }   public GrIDItem(Context context,AttributeSet attrs) {  this(context,attrs,AttributeSet attrs,int defStyle) {  super(context,defStyle);  // Todo auto-generated constructor stub  mContext = context;  LayoutInflater.from(mContext).inflate(R.layout.grID_item,this);  mimgVIEw = (ImageVIEw) findVIEwByID(R.ID.img_vIEw);  mSecletVIEw = (ImageVIEw) findVIEwByID(R.ID.select);  }   @OverrIDe  public voID setChecked(boolean checked) {  // Todo auto-generated method stub  mChecked = checked;  setBackgroundDrawable(checked ? getResources().getDrawable(   R.drawable.background) : null);  mSecletVIEw.setVisibility(checked ? VIEw.VISIBLE : VIEw.GONE);//选上了则显示小勾图片  }   @OverrIDe  public boolean isChecked() {  // Todo auto-generated method stub  return mChecked;  }   @OverrIDe  public voID toggle() {  setChecked(!mChecked);  }   public voID setimgResID(int resID) {  if (mimgVIEw != null) {   mimgVIEw.setBackgroundResource(resID);//设置背景  }  }  } 

主activity文件：

package com.kiritor;  import java.util.HashMap; import java.util.Map; import java.util.Set; import androID.app.Activity; import androID.content.Context; import androID.os.Bundle; import androID.vIEw.ActionMode; import androID.vIEw.LayoutInflater; import androID.vIEw.Menu; import androID.vIEw.MenuItem; import androID.vIEw.VIEw; import androID.vIEw.VIEwGroup; import androID.Widget.AbsListVIEw.LayoutParams; import androID.Widget.AbsListVIEw.MultiChoiceModeListener; import androID.Widget.BaseAdapter; import androID.Widget.Checkable; import androID.Widget.FrameLayout; import androID.Widget.GrIDVIEw; import androID.Widget.ImageVIEw; import androID.Widget.listadapter; import androID.Widget.TextVIEw;  public class HomeActivity extends Activity implements MultiChoiceModeListener {   private GrIDVIEw mGrIDVIEw;  private GrIDAdapter mGrIDAdapter;  private TextVIEw mActionText;  private static final int MENU_SELECT_ALL = 0;  private static final int MENU_UNSELECT_ALL = MENU_SELECT_ALL + 1;  private Map<Integer,Boolean> mSelectMap = new HashMap<Integer,Boolean>();   private int[] mimgIDs = new int[] { R.drawable.img_1,R.drawable.img_2,R.drawable.img_3,R.drawable.img_4,R.drawable.img_5,R.drawable.img_6,R.drawable.img_7,R.drawable.img_8,R.drawable.img_9,R.drawable.img_1,R.drawable.img_5 };   /** Called when the activity is first created. */  @OverrIDe  public voID onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentVIEw(R.layout.main);  mGrIDVIEw = (GrIDVIEw) findVIEwByID(R.ID.grIDvIEw);  mGrIDVIEw.setChoiceMode(GrIDVIEw.CHOICE_MODE_MulTIPLE_MODAL);// 设置为多选模式  mGrIDAdapter = new GrIDAdapter(this);  mGrIDVIEw.setAdapter(mGrIDAdapter);// 数据适配  mGrIDVIEw.setMultiChoiceModeListener(this);// 设置多选模式监听器  }   /** OverrIDe MultiChoiceModeListener start **/  @OverrIDe  public boolean onCreateActionMode(ActionMode mode,Menu menu) {  // Todo auto-generated method stub  // 得到布局文件的VIEw  VIEw v = LayoutInflater.from(this).inflate(R.layout.actionbar_layout,null);  mActionText = (TextVIEw) v.findVIEwByID(R.ID.action_text);  // 设置显示内容为GrIDVIEw选中的项目个数  mActionText.setText(formatString(mGrIDVIEw.getCheckedItemCount()));  // 设置动作条的视图  mode.setCustomVIEw(v);  // 得到菜单  getMenuInflater().inflate(R.menu.action_menu,menu);  return true;  }   @OverrIDe  public boolean onPrepareActionMode(ActionMode mode,Menu menu) {  // Todo auto-generated method stub  /* 初始状态下,如果选中的项数不等于总共的项数,设置"全选"的状态为True */  menu.getItem(MENU_SELECT_ALL).setEnabled(   mGrIDVIEw.getCheckedItemCount() != mGrIDVIEw.getCount());  return true;  }   @OverrIDe  public boolean onActionItemClicked(ActionMode mode,MenuItem item) {  // Todo auto-generated method stub  /*   * 当点击全选的时候,全选 点击全不选的时候全不选   */  switch (item.getItemID()) {  case R.ID.menu_select:   for (int i = 0; i < mGrIDVIEw.getCount(); i++) {   mGrIDVIEw.setItemChecked(i,true);   mSelectMap.put(i,true);   }   break;  case R.ID.menu_unselect:   for (int i = 0; i < mGrIDVIEw.getCount(); i++) {   mGrIDVIEw.setItemChecked(i,false);   mSelectMap.clear();   }   break;  }  return true;  }   @OverrIDe  public voID onDestroyActionMode(ActionMode mode) {  // Todo auto-generated method stub  mGrIDAdapter.notifyDataSetChanged();  }   @OverrIDe  public voID onItemCheckedStateChanged(ActionMode mode,int position,long ID,boolean checked) {  // Todo auto-generated method stub  // 当每个项状态改变的时候的 *** 作  mActionText.setText(formatString(mGrIDVIEw.getCheckedItemCount()));  mSelectMap.put(position,checked);/* 放入选中的集合中 */  mode.invalIDate();  }   /** OverrIDe MultiChoiceModeListener end **/   private String formatString(int count) {  return String.format(getString(R.string.selection),count);  }   private class GrIDAdapter extends BaseAdapter {   private Context mContext;   public GrIDAdapter(Context ctx) {   mContext = ctx;  }   @OverrIDe  public int getCount() {   // Todo auto-generated method stub   return mimgIDs.length;  }   @OverrIDe  public Integer getItem(int position) {   // Todo auto-generated method stub   return Integer.valueOf(mimgIDs[position]);  }   @OverrIDe  public long getItemID(int position) {   // Todo auto-generated method stub   return position;  }   @SuppressWarnings("deprecation")  @OverrIDe  /* 得到VIEw */  public VIEw getVIEw(int position,VIEw convertVIEw,VIEwGroup parent) {   GrIDItem item;   if (convertVIEw == null) {   item = new GrIDItem(mContext);   item.setLayoutParams(new LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));   } else {   item = (GrIDItem) convertVIEw;   }   item.setimgResID(getItem(position));   item.setChecked(mSelectMap.get(position) == null ? false    : mSelectMap.get(position));   return item;  }  }  } 

完整源码：多选效果

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的Android网格布局GridView实现漂亮的多选效果全部内容，希望文章能够帮你解决Android网格布局GridView实现漂亮的多选效果所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。