Android实现微信的图片选择器

概述现在大部分的App都上传图片的功能，比如设置用户头像、聊天发送图片、发表动态、论坛帖子等。上传图片需要先从选择手机中选择要上传的图片，所以图片选择器在App中是很常见的组件，一般的手机都会自带一个图片选择器

现在大部分的App都上传图片的功能，比如设置用户头像、聊天发送图片、发表动态、论坛帖子等。上传图片需要先从选择手机中选择要上传的图片，所以图片选择器在App中是很常见的组件，一般的手机都会自带一个图片选择器。不过很多App并不喜欢用手机自带的选择器，而是自己实现一个图片选择器。比如微信的图片选择器就做的很好。所以我也仿照微信的样式和交互效果，自己做了一个图片选择器：ImageSelector。ImageSelector支持图片的单选、限数量的多选和不限数量的多选。支持图片预览和图片文件夹的切换。项目已经上传到了我的GitHub，欢迎大家下载和使用。

本篇文章我将为大家介绍ImageSelector是如何现实的。由于ImageSelector的项目代码比较多，所以这篇文章只讲解ImageSelector的实现思路和分析主要的项目代码。想要看完整代码的同学请到GitHub下载项目。至于ImageSelector的使用，在我的另一篇文章中有

详细的介绍：《Android 仿微信的图片选择器ImageSelector的使用》 。

先上效果图：

要实现一个图片选择器，需要做的主要就是以下几个事情：

1、从手机存储卡中扫描加载图片。
2、用一个列表将图片显示出来。
3、选择图片。
4、把选中的图片返回给调用者。

准备工作

首先需要导入两个第三方库。

//图片加载库，用于加载图片compile 'com.github.bumptech.glIDe:glIDe:3.7.0'//图片缩放库，用于图片的预览compile 'com.github.chrisbanes:PhotoVIEw:2.0.0'

第一步：从手机存储卡中扫描加载图片

读取手机存储卡需要先申请权限：

<uses-permission androID:name="androID.permission.WRITE_EXTERNAL_STORAGE" />

对AndroID 6.0以上的系统做动态权限处理。

 /**  * 检查权限并加载SD卡里的图片。  */ private voID checkPermissionAndLoadImages() {   int hasWriteContactsPermission = ContextCompat.checkSelfPermission(getApplication(),Manifest.permission.WRITE_EXTERNAL_STORAGE);  if (hasWriteContactsPermission == PackageManager.PERMISSION_GRANTED) {   //有权限，加载图片。   loadImageForSDCard();  } else {   //没有权限，申请权限。   ActivityCompat.requestPermissions(ImageSelectorActivity.this,new String[]{Manifest.permission.WRITE_EXTERNAL_STORAGE},PERMISSION_REQUEST_CODE);  } } /**  * 处理权限申请的回调。  */ @OverrIDe public voID onRequestPermissionsResult(int requestCode,String[] permissions,int[] grantResults) {  if (requestCode == PERMISSION_REQUEST_CODE) {   if (grantResults.length > 0     && grantResults[0] == PackageManager.PERMISSION_GRANTED) {    //允许权限，加载图片。    loadImageForSDCard();   } else {    //拒绝权限，d出提示框。    showExceptionDialog();   }  } }

接着就是从手机存储卡中扫描加载图片。

 /**  * 从SDCard加载图片。  */ private voID loadImageForSDCard() {  ImageModel.loadImageForSDCard(this,new ImageModel.DataCallback() {   @OverrIDe   public voID onSuccess(ArrayList<Folder> folders) {    //folders是图片文件夹的列表，每个文件夹中都有若干张图片。   }  }); }

我将扫描手机存储卡的 *** 作封装在ImageModel类，并通过DataCallback把扫描的结果返回给调用者。返回的结果是一个文件夹的列表，这是因为我们的图片选择器需要实现文件夹切换的功能，所以我把扫描出来的图片按文件夹进行了拆分。
下面看文件夹实体类Folder 和图片实体类 Image：

/** * 图片文件夹实体类 */public class Folder { private String name; private ArrayList<Image> images; public Folder(String name) {  this.name = name; } public Folder(String name,ArrayList<Image> images) {  this.name = name;  this.images = images; } public String getname() {  return name; } public voID setname(String name) {  this.name = name; } public ArrayList<Image> getimages() {  return images; } public voID setimages(ArrayList<Image> images) {  this.images = images; } public voID addImage(Image image) {  if (image != null && StringUtils.isNotEmptyString(image.getPath())) {   if (images == null) {    images = new ArrayList<>();   }   images.add(image);  } }}/** *图片实体类 */public class Image { private String path; private long time; private String name; public Image(String path,long time,String name) {  this.path = path;  this.time = time;  this.name = name; } public String getPath() {  return path; } public voID setPath(String path) {  this.path = path; } public long getTime() {  return time; } public voID setTime(long time) {  this.time = time; } public String getname() {  return name; } public voID setname(String name) {  this.name = name; }}

注意，最核心的代码来了：使用ContentProvIDer扫描手机中的所有图片。

public class ImageModel { /**  * 从SDCard加载图片  */ public static voID loadImageForSDCard(final Context context,final DataCallback callback) {  //由于扫描图片是耗时的 *** 作，所以要在子线程处理。  new Thread(new Runnable() {   @OverrIDe   public voID run() {    //扫描图片    Uri mImageUri = MediaStore.Images.Media.EXTERNAL_CONTENT_URI;    ContentResolver mContentResolver = context.getContentResolver();    Cursor mCursor = mContentResolver.query(mImageUri,new String[]{        MediaStore.Images.Media.DATA,MediaStore.Images.Media.disPLAY_name,MediaStore.Images.Media.DATE_ADDED,MediaStore.Images.Media._ID},null,MediaStore.Images.Media.DATE_ADDED);    ArrayList<Image> images = new ArrayList<>();    //读取扫描到的图片    while (mCursor.movetoNext()) {     // 获取图片的路径     String path = mCursor.getString(       mCursor.getColumnIndex(MediaStore.Images.Media.DATA));     //获取图片名称     String name = mCursor.getString(       mCursor.getColumnIndex(MediaStore.Images.Media.disPLAY_name));     //获取图片时间     long time = mCursor.getLong(       mCursor.getColumnIndex(MediaStore.Images.Media.DATE_ADDED));     images.add(new Image(path,time,name));    }    mCursor.close();    Collections.reverse(images);    callback.onSuccess(splitFolder(images));   }  }).start(); } /**  * 把图片按文件夹拆分，第一个文件夹保存所有的图片  */ private static ArrayList<Folder> splitFolder(ArrayList<Image> images) {  ArrayList<Folder> folders = new ArrayList<>();  folders.add(new Folder("全部图片",images));  if (images != null && !images.isEmpty()) {   int size = images.size();   for (int i = 0; i < size; i++) {    String path = images.get(i).getPath();    String name = getFoldername(path);    if (StringUtils.isNotEmptyString(name)) {     Folder folder = getFolder(name,folders);     folder.addImage(images.get(i));    }   }  }  return folders; } /**  * 根据图片路径，获取图片文件夹名称  */ private static String getFoldername(String path) {  if (StringUtils.isNotEmptyString(path)) {   String[] strings = path.split(file.separator);   if (strings.length >= 2) {    return strings[strings.length - 2];   }  }  return ""; } private static Folder getFolder(String name,List<Folder> folders) {  if (folders != null && !folders.isEmpty()) {   int size = folders.size();   for (int i = 0; i < size; i++) {    Folder folder = folders.get(i);    if (name.equals(folder.getname())) {     return folder;    }   }  }  Folder newFolder = new Folder(name);  folders.add(newFolder);  return newFolder; } public interface DataCallback {  voID onSuccess(ArrayList<Folder> folders); }}

到这里，我们就已经拿到了手机里的所有图片了，接下来就是展示图片列表。

第二步：展示图片

这个非常的简单，其实就是写一个图片列表。

 //图片列表 private RecyclerVIEw rvImage; // 初始化图片列表 private voID initimageList() {  mLayoutManager = new GrIDLayoutManager(this,3);  rvImage.setLayoutManager(mLayoutManager);  mAdapter = new ImageAdapter(this,mMaxCount,isSingle);  rvImage.setAdapter(mAdapter); }

这里的ImageAdapter，就是图片列表的Adapter。

public class ImageAdapter extends RecyclerVIEw.Adapter<ImageAdapter.VIEwHolder> { private Context mContext; private ArrayList<Image> mImages; private LayoutInflater mInflater; private int mMaxCount; private boolean isSingle; /**  * @param maxCount 图片的最大选择数量，小于等于0时，不限数量，isSingle为false时才有用。  * @param isSingle 是否单选  */  public ImageAdapter(Context context,int maxCount,boolean isSingle) {  mContext = context;  this.mInflater = LayoutInflater.from(mContext);  mMaxCount = maxCount;  this.isSingle = isSingle; } @OverrIDe public VIEwHolder onCreateVIEwHolder(VIEwGroup parent,int vIEwType) {  VIEw vIEw = mInflater.inflate(R.layout.adapter_images_item,parent,false);  return new VIEwHolder(vIEw); } @OverrIDe public voID onBindVIEwHolder(final VIEwHolder holder,final int position) {  final Image image = mImages.get(position);  GlIDe.with(mContext).load(new file(image.getPath()))    .diskCacheStrategy(diskCacheStrategy.NONE).into(holder.ivImage); } @OverrIDe public int getItemCount() {  return mImages == null ? 0 : mImages.size(); } static class VIEwHolder extends RecyclerVIEw.VIEwHolder {  ImageVIEw ivImage;  ImageVIEw ivSelectIcon;  ImageVIEw ivMasking;  public VIEwHolder(VIEw itemVIEw) {   super(itemVIEw);   ivImage = (ImageVIEw) itemVIEw.findVIEwByID(R.ID.iv_image);   ivSelectIcon = (ImageVIEw) itemVIEw.findVIEwByID(R.ID.iv_select);   ivMasking = (ImageVIEw) itemVIEw.findVIEwByID(R.ID.iv_masking);  } }}

第三步：选择图片

点击选择图片，主要是对图片列表的ImageAdapter中的item进行 *** 作，所以我就直接写在了ImageAdapter类里。选中的图片用一个数组保存。

 //保存选中的图片 private ArrayList<Image> mSelectimages = new ArrayList<>(); //点击选中/取消选中图片 holder.ivSelectIcon.setonClickListener(new VIEw.OnClickListener() {   @OverrIDe   public voID onClick(VIEw v) {    if (mSelectimages.contains(image)) {     //如果图片已经选中，就取消选中     unSelectimage(image);     setItemSelect(holder,false);    } else if (isSingle) {     //如果是单选，就先清空已经选中的图片，再选中当前图片     clearImageSelect();     selectimage(image);     setItemSelect(holder,true);    } else if (mMaxCount <= 0 || mSelectimages.size() < mMaxCount) {     //如果不限制图片的选中数量，或者图片的选中数量还没有达到最大限制，就直接选中当前图片。     selectimage(image);     setItemSelect(holder,true);    }   }  }); /**  * 选中图片  */ private voID selectimage(Image image){  mSelectimages.add(image); } /**  * 取消选中图片  */ private voID unSelectimage(Image image){  mSelectimages.remove(image); } /**  * 设置图片选中和未选中的效果  */ private voID setItemSelect(VIEwHolder holder,boolean isSelect) {  if (isSelect) {   holder.ivSelectIcon.setimageResource(R.drawable.icon_image_select);   holder.ivMasking.setAlpha(0.5f);  } else {   holder.ivSelectIcon.setimageResource(R.drawable.icon_image_un_select);   holder.ivMasking.setAlpha(0.2f);  } }

第四步：把选中的图片返回给调用者

点击“确定”按钮时，把选中的图片通过Intent返回给调用者。

private voID confirm() {  //因为图片的实体类是Image，而我们返回的是String数组，所以要进行转换。  ArrayList<Image> selectimages = mAdapter.getSelectimages();  ArrayList<String> images = new ArrayList<>();  for (Image image : selectimages) {   images.add(image.getPath());  }  //点击确定，把选中的图片通过Intent传给上一个Activity。  Intent intent = new Intent();  intent.putStringArrayListExtra(ImageSelectorUtils.SELECT_RESulT,images);  setResult(RESulT_OK,intent);  //关闭页面  finish(); }

到这里，图片选择器的基本现实思路和主要的功能代码就介绍完了。在这个ImageSelector项目中，还有很多其他的知识，比如图片文件夹切换、手机横竖屏切换、图片预览、动画效果、点击效果等，这里就不一一介绍了，有兴趣的同学可以去看完整的项目代码。在项目中，我也给出了很详细的代码注释，方便大家阅读。

最后给出ImageSelector的项目地址

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

总结

以上是内存溢出为你收集整理的Android实现微信的图片选择器全部内容，希望文章能够帮你解决Android实现微信的图片选择器所遇到的程序开发问题。

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