欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Android ImageSelector微信图片选择器

程序员文章站 2022-10-13 10:09:50
前言 现在绝大多数的app都上传图片的功能,比如设置用户头像、聊天发送图片、发表动态、论坛帖子等。上传图片需要先从选择手机中选择要上传的图片,所以图片选择器在app中是很...

前言

现在绝大多数的app都上传图片的功能,比如设置用户头像、聊天发送图片、发表动态、论坛帖子等。上传图片需要先从选择手机中选择要上传的图片,所以图片选择器在app中是很常见的组件,一般的手机都会自带一个图片选择器。不过很多app并不喜欢用手机自带的选择器,而是自己实现一个图片选择器。

比如微信的图片选择器就做的很好。没办法,谁让微信这么强大,我不超抄袭你,但是,我可以模仿你。

效果图

Android ImageSelector微信图片选择器
Android ImageSelector微信图片选择器
Android ImageSelector微信图片选择器

是不是和真的一样,哈哈,不过,作者的唯一缺陷就是没有提供拍照,唉,有一点遗憾,但是,这个就够用了!

思路

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

准备工作

引入依赖

//在project的build.gradle在添加以下代码
allprojects {
  repositories {
   ...
   maven { url 'https://jitpack.io' }
   // 如果你使用的是1.4.0或更早的版本,这句可以不用。
   maven { url 'https://maven.google.com' }
  }
 }
//在module的build.gradle在添加以下代码
compile 'com.github.donkingliang:imageselector:1.5.0'

配置androidmanifest.xml

//储存卡的读取权限
<uses-permission android:name="android.permission.write_external_storage" />

//图片选择activity
<activity android:name="com.donkingliang.imageselector.imageselectoractivity"
 //去掉activity的actionbar。
 //使用者可以根据自己的项目去配置,不一定要这样写,只要不activity的actionbar去掉就可以了。
 android:theme="@style/theme.appcompat.light.noactionbar"
 //横竖屏切换处理。
 //如果要支持横竖屏切换,一定要加上这句,否则在切换横竖屏的时候会发生异常。
 android:configchanges="orientation|keyboardhidden|screensize"/>

//图片预览activity
<activity android:name="com.donkingliang.imageselector.previewactivity"
 android:theme="@style/theme.appcompat.light.noactionbar"
 android:configchanges="orientation|keyboardhidden|screensize"/>

//图片剪切activity
<activity
 android:name="com.donkingliang.imageselector.clipimageactivity"
 android:theme="@style/theme.appcompat.light.noactionbar" />

调起图片选择器

//单选
 imageselectorutils.openphoto(mainactivity.this, request_code, true, 0);

//限数量的多选(比喻最多9张)
imageselectorutils.openphoto(mainactivity.this, request_code, false, 9);
imageselectorutils.openphoto(mainactivity.this, request_code, false, 9, selected); // 把已选的传入。

//不限数量的多选
imageselectorutils.openphoto(mainactivity.this, request_code);
imageselectorutils.openphoto(mainactivity.this, request_code, selected); // 把已选的传入。
//或者
imageselectorutils.openphoto(mainactivity.this, request_code, false, 0);
imageselectorutils.openphoto(mainactivity.this, request_code, false, 0, selected); // 把已选的传入。

//单选并剪裁
imageselectorutils.openphotoandclip(mainactivity.this, request_code);

request_code就是调用者自己定义的启动activity时的requestcode,这个相信大家都能明白。selected可以在再次打开选择器时,把原来已经选择过的图片传入,使这些图片默认为选中状态。

接收选择器返回的数据

 @override
 protected void onactivityresult(int requestcode, int resultcode, intent data) {
  super.onactivityresult(requestcode, resultcode, data);
  if (requestcode == request_code && data != null) {
  //获取选择器返回的数据
   arraylist<string> images = data.getstringarraylistextra(
   imageselectorutils.select_result);
  }
 }

imageselectorutils.select_result是接收数据的key。数据是以arraylist的字符串数组返回的,就算是单选,返回的也是arraylist数组,只不过这时候arraylist只有一条数据而已。arraylist里面的数据就是选中的图片的文件路径。

是不是有点懵了,我附上实际操作代码

1. adapter_image.xml布局

<?xml version="1.0" encoding="utf-8"?>
<framelayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:layout_gravity="center"
 android:layout_margin="1dp">

 <com.donkingliang.imageselector.view.squareimageview
  android:id="@+id/iv_image"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:layout_gravity="center"
  android:background="#010101"
  android:scaletype="centercrop" />

</framelayout>

2.主布局

<?xml version="1.0" encoding="utf-8"?>
<relativelayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 tools:context=".mainactivity">

 <button
  android:id="@+id/btn_single"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_margin="10dp"
  android:text="单选" />

 <button
  android:id="@+id/btn_limit"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_aligntop="@+id/btn_single"
  android:layout_torightof="@+id/btn_single"
  android:text="多选(最多9张)" />

 <button
  android:id="@+id/btn_unlimited"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_alignleft="@+id/btn_single"
  android:layout_below="@+id/btn_single"
  android:text="多选(不限数量)" />

 <button
  android:id="@+id/btn_clip"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:layout_aligntop="@+id/btn_unlimited"
  android:layout_marginleft="10dp"
  android:layout_torightof="@+id/btn_unlimited"
  android:text="单选并剪裁" />

 <android.support.v7.widget.recyclerview
  android:id="@+id/rv_image"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:layout_below="@+id/btn_unlimited"
  android:layout_margintop="10dp" />

</relativelayout>

3.imageadapter(图片选择器工具类)

public class imageadapter extends recyclerview.adapter<imageadapter.viewholder> {

 private context mcontext;
 private arraylist<string> mimages;
 private layoutinflater minflater;

 public imageadapter(context context) {
  mcontext = context;
  this.minflater = layoutinflater.from(mcontext);
 }

 public arraylist<string> getimages() {
  return mimages;
 }

 @override
 public viewholder oncreateviewholder(viewgroup parent, int viewtype) {
  view view = minflater.inflate(r.layout.adapter_image, parent, false);
  return new viewholder(view);
 }

 @override
 public void onbindviewholder(final viewholder holder, final int position) {
  final string image = mimages.get(position);
  glide.with(mcontext).load(new file(image)).into(holder.ivimage);
 }

 @override
 public int getitemcount() {
  return mimages == null ? 0 : mimages.size();
 }

 public void refresh(arraylist<string> images) {
  mimages = images;
  notifydatasetchanged();
 }

 static class viewholder extends recyclerview.viewholder {

  imageview ivimage;

  public viewholder(view itemview) {
   super(itemview);
   ivimage = itemview.findviewbyid(r.id.iv_image);
  }
 }
}

4.业务逻辑

package com.example.imageselector;

import android.content.intent;
import android.os.bundle;
import android.support.v7.app.appcompatactivity;
import android.support.v7.widget.gridlayoutmanager;
import android.support.v7.widget.recyclerview;
import android.view.view;
import android.widget.button;

import com.donkingliang.imageselector.utils.imageselectorutils;

import java.util.arraylist;

import butterknife.bindview;
import butterknife.butterknife;
import butterknife.onclick;

public class mainactivity extends appcompatactivity {

 @bindview(r.id.btn_single)
 button btnsingle;
 @bindview(r.id.btn_limit)
 button btnlimit;
 @bindview(r.id.btn_unlimited)
 button btnunlimited;
 @bindview(r.id.btn_clip)
 button btnclip;
 @bindview(r.id.rv_image)
 recyclerview rvimage;
 private static final int request_code = 0x00000011;
 private imageadapter madapter;

 @override
 protected void oncreate(bundle savedinstancestate) {
  super.oncreate(savedinstancestate);
  setcontentview(r.layout.activity_main);
  butterknife.bind(this);

  rvimage.setlayoutmanager(new gridlayoutmanager(this, 3));
  madapter = new imageadapter(this);
  rvimage.setadapter(madapter);


 }

 @override
 protected void onactivityresult(int requestcode, int resultcode, intent data) {
  super.onactivityresult(requestcode, resultcode, data);
  if (requestcode == request_code && data != null) {
   arraylist<string> images = data.getstringarraylistextra(imageselectorutils.select_result);
   madapter.refresh(images);
  }
 }


 @onclick({r.id.btn_single, r.id.btn_limit, r.id.btn_unlimited, r.id.btn_clip})
 public void onviewclicked(view view) {
  switch (view.getid()) {
   case r.id.btn_single:
    //单选
    imageselectorutils.openphoto(mainactivity.this, request_code, true, 0);
    break;
   case r.id.btn_limit:
    //多选(最多9张)
    imageselectorutils.openphoto(mainactivity.this, request_code, false, 10);
    //imageselectorutils.openphoto(mainactivity.this, request_code, false, 9, madapter.getimages()); // 把已选的传入。
    break;
   case r.id.btn_unlimited:
    //多选(不限数量)
    imageselectorutils.openphoto(mainactivity.this, request_code);
    //imageselectorutils.openphoto(mainactivity.this, request_code, madapter.getimages()); // 把已选的传入。
    //或者
    //imageselectorutils.openphoto(mainactivity.this, request_code, false, 0);
    //imageselectorutils.openphoto(mainactivity.this, request_code, false, 0, madapter.getimages()); // 把已选的传入。
    break;
   case r.id.btn_clip:
    //单选并剪裁
    imageselectorutils.openphotoandclip(mainactivity.this, request_code);
    break;
  }
 }
}

最后,感谢大牛提供的源码框架,我真的非常喜欢。

android图片选择器,仿微信的图片选择器的样式和效果。支持图片的单选、限数量的多选和不限数量的多选。支持图片预览和图片文件夹的切换。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。