«

android GridView实现图库预览图,多选模式下右上角打勾

时间:2024-3-2 17:26     作者:韩俊     分类: Android


转自: http://blog.csdn.net/zhouyuanjing/article/details/8372686


看到有初学者有这样的需求: GridView实现图库预览图,多选模式下右上角打勾。(4.0图库的预览图多选时,多了个蓝色边框,其实是蓝色背景)

GridView在自己实际开发中也没用到过,就想试着实现下,写个demo供初学者参考,高手略过。

先来个效果图吧:


实现起来不复杂,就2个文件。 首先看看GridView继承关系:

java.lang.Object


android.view.View


android.view.ViewGroup


android.widget.AdapterView<T extends android.widget.Adapter>


android.widget.AbsListView


android.widget.GridView

我们知道ListView有单选模式和多选模式[AbsListView.setChoiceMode(AbsListView.CHOICE_MODE_SINGLE/AbsListView.CHOICE_MODE_MULTIPLE_MODAL)]

那么GridView也支持多选模式。

废话不多说,相信你也知道!贴代码吧

主布局文件:main.xml

[html] view
plaincopy

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android&quot;
android:layout_width="fill_parent"
android:layout_height="fill_parent" >

&lt;GridView  
    android:id=&quot;@&#43;id/gridview&quot;  
    android:layout_width=&quot;fill_parent&quot;  
    android:layout_height=&quot;wrap_content&quot;  
    android:columnWidth=&quot;75dip&quot;  
    android:gravity=&quot;center&quot;  
    android:horizontalSpacing=&quot;2dip&quot;  
    android:numColumns=&quot;4&quot;  
    android:verticalSpacing=&quot;2dip&quot; /&gt;  

</LinearLayout>

主Activity:HomeActivity

[java] view
plaincopy

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 &#43; 1;  
private Map&lt;Integer, Boolean&gt; mSelectMap = new HashMap&lt;Integer, Boolean&gt;();  

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 &lt; mGridView.getCount(); i&#43;&#43;) {  
            mGridView.setItemChecked(i, true);  
            mSelectMap.put(i, true);  
        }  
        break;  
    case R.id.menu_unselect:  
        for (int i = 0; i &lt; mGridView.getCount(); i&#43;&#43;) {  
            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

[java] view
plaincopy

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

[html] view
plaincopy

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android&quot;
android:layout_width="fill_parent"
android:layout_height="fill_parent" >

&lt;ImageView  
    android:id=&quot;@&#43;id/img_view&quot;  
    android:layout_width=&quot;fill_parent&quot;  
    android:layout_height=&quot;fill_parent&quot;  
    android:scaleType=&quot;fitXY&quot; /&gt;  

&lt;ImageView  
    android:id=&quot;@&#43;id/select&quot;  
    android:layout_width=&quot;wrap_content&quot;  
    android:layout_height=&quot;wrap_content&quot;  
    android:layout_alignParentRight=&quot;true&quot;  
    android:layout_alignParentTop=&quot;true&quot;  
    android:background=&quot;@drawable/icon_choice&quot;  
    android:visibility=&quot;gone&quot; /&gt;  

</RelativeLayout>

就这么多啦。左上角的勾,就是控制 ImageView 显示与不显示的问题。<br style="color:rgb(51,51,51); font-family:Arial; font-size:14.399999618530273px; line-height:26px">

源码路径:http://download.csdn.net/detail/zhouyuanjing/4916510

~~完~~

标签: android

热门推荐