android GridView实现图库预览图，多选模式下右上角打勾
16lz
2021-01-23
看到有初学者有这样的需求：GridView实现图库预览图，多选模式下右上角打勾。（4.0图库的预览图多选时，多了个蓝色边框，其实是蓝色背景）
GridView在自己实际开发中也没用到过，就想试着实现下，写个demo供初学者参考,高手略过。
先来个效果图吧：
实现起来不复杂，就2个文件。 首先看看GridView继承关系：
| java.lang.Object | |||||
| ↳ | android.view.View | ||||
| ↳ | android.view.ViewGroup | ||||
| ↳ | android.widget.AdapterView<Textendsandroid.widget.Adapter> | ||||
| ↳ | android.widget.AbsListView | ||||
| ↳ | android.widget.GridView | ||||
我们知道ListView有单选模式和多选模式[AbsListView.setChoiceMode(AbsListView.CHOICE_MODE_SINGLE/AbsListView.CHOICE_MODE_MULTIPLE_MODAL)]
那么GridView也支持多选模式。
废话不多说，相信你也知道！贴代码吧
主布局文件：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" /></LinearLayout>
主Activity：HomeActivity
package com.xyz.gridview;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_2, R.drawable.img_3, R.drawable.img_4, R.drawable.img_5, R.drawable.img_6, R.drawable.img_7 }; /** 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 v = LayoutInflater.from(this).inflate(R.layout.actionbar_layout, null); mActionText = (TextView) v.findViewById(R.id.action_text); 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 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; } @Override public View getView(int position, View convertView, ViewGroup parent) { // TODO Auto-generated method stub 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; } }} 上面用到 GridItem是自己封装的一个类：GridItem.java package com.xyz.gridview;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 mSelcetView = null; public GridItem(Context context) { this(context, null, 0); } public GridItem(Context context, AttributeSet attrs) { this(context, attrs, 0); } public GridItem(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); // TODO Auto-generated constructor stub mContext = context; LayoutInflater.from(mContext).inflate(R.layout.grid_item, this); mImgView = (ImageView) findViewById(R.id.img_view); mSelcetView = (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); mSelcetView.setVisibility(checked ? View.VISIBLE : View.GONE); } @Override public boolean isChecked() { // TODO Auto-generated method stub return mChecked; } @Override public void toggle() { // TODO Auto-generated method stub setChecked(!mChecked); } public void setImgResId(int resId) { if (mImgView != null) { mImgView.setBackgroundResource(resId); } }} 这个类引用的一个布局：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>就这么多啦。左上角的勾，就是控制 ImageView 显示与不显示的问题。
源码路径：http://download.csdn.net/detail/zhouyuanjing/4916510
~~完~~
更多相关文章
- Android 输入法弹出监听，保持标题固定不被顶出布局，EditText显示在
- android设计模式之Composite
- [置顶] Android界面布局的几种常用方式
- 【Android】利用Java代码布局，按钮添加点击事件
- Android 开发之深入分析布局文件&又是“Hello World！”
- LayoutTransition 容器布局动画
- Android SDK工具：使用layoutopt进行布局优化
- Android中的设计模式-单例模式
- 框架模式MVP在Android中的使用