精选案例Android开发安卓集中营

私人订制Android本地图片选择器

2016-11-29  本文已影响1170人  代码咖啡

效果图

效果图

需求分析

第三方框架使用

史上最强的安卓图片选择器——GalleryFinal;
简书博客地址——http://www.jianshu.com/p/48ddd6756b7a

实现目标

应用并修改第三方框架GalleryFinal源码，实现效果图的样式。

具体实现

git clone https://github.com/pengjianbo/GalleryFinal.git

选择Android Studio菜单栏File->New->import Module...，导入GalleryFinal源代码到Android Studio：

导入GalleryFinal源码
详情参考：
【Mac流派】程序猿修炼之道(6)-技能篇之git指令
Android Studio导入第三方库的三种方法 
// ------- 声明 -------
// 主题配置
private ThemeConfig mThemeConfig;
// 图片加载器
private cn.finalteam.galleryfinal.ImageLoader mGlidImgLoader;
// 滚动监听事件
private PauseOnScrollListener mPauseOnScrollListener;
// 功能配置
private FunctionConfig mFunctionConfig;
// 核心配置
private CoreConfig mCoreConfig;
// ------- 实现 -------
// 获取标题栏背景颜色
int colorTitleBarBg = ContextCompat.getColor(Activity.this, R.color.titleBarBgColor);
// 标题栏文字颜色
int colorTitleBarText = ContextCompat.getColor(Activity.this, R.color.titleBarTextColor);
// 浮动按钮常规颜色
int colorFabNormal = ContextCompat.getColor(Activity.this, R.color.color_ffaa2a);
// 浮动按钮点击颜色
int colorFabPressed = ContextCompat.getColor(Activity.this, R.color.color_e29428);
// 标题栏按钮颜色
int colorTitleBarIcon = ContextCompat.getColor(MainActivity.this, R.color.colorTitleBarIcon);
// 设置主题
mThemeConfig = new ThemeConfig.Builder()
        .setTitleBarBgColor(colorTitleBarBg) // 设置标题栏背景颜色
        .setTitleBarTextColor(colorTitleBarText)    // 设置标题栏文字颜色
        .setFabNormalColor(colorFabNormal)  // 设置浮动按钮常规颜色
        .setFabPressedColor(colorFabPressed)    // 设置浮动按钮点击颜色
        .setCheckSelectedColor(colorFabNormal)  // 设置选中标记（对勾）的颜色和按钮的颜色相同
        .setTitleBarIconColor(colorTitleBarIcon) // 设置标题栏按钮颜色
        .setIconBack(R.drawable.ic_back) // 设置返回按钮
        .build();
// 初始化图片加载器
mGlidImgLoader = new GlideImageLoader();
// 初始化监听事件
mPauseOnScrollListener = new GlidePauseOnScrollListener(false, true);
// 初始化功能配置
FunctionConfig.Builder funConBuilder = new FunctionConfig.Builder();
// 设置最多可选择5张照图片
funConBuilder.setMutiSelectMaxSize(5);
// 设置图片不可编辑
funConBuilder.setEnableEdit(false);
// 设置图片不可旋转
funConBuilder.setEnableRotate(false);
// 设置图片不可裁剪
funConBuilder.setEnableCrop(false);
// 设置不可通过照相选择照片
funConBuilder.setEnableCamera(false);
// 设置添加过滤集合，过滤掉之前选中的图片
//        funConBuilder.setFilter(mPhotoList);
// 不过滤图片，而是将之前选中的图片设置为选中状态
funConBuilder.setSelected(mPhotoList);
// 设置可预览
funConBuilder.setEnablePreview(true);
// 功能配置
mFunctionConfig = funConBuilder.build();
// 初始化核心配置
mCoreConfig = new CoreConfig.Builder(ReportActivity.this, mGlidImgLoader, mThemeConfig)
        .setFunctionConfig(mFunctionConfig) // 添加功能配置
        .setPauseOnScrollListener(mPauseOnScrollListener) // 滑动停止加载事件
        .setNoAnimcation(true) // 无特效动画
        .build();
// 实例化
GalleryFinalGalleryFinal.init(mCoreConfig);
// 多图片选择打开相册
GalleryFinal.openGalleryMuti(Constants.REQUEST_CODE_GALLERY, mFunctionConfig,
        mOnHandlerResultCallback);
// 初始化图片加载器
initImageLoader(ReportActivity.this);

/**
 * 初始化图片加载器
 *
 * @param context
 */
private void initImageLoader(Context context) {
    // 图片加载器配置
    ImageLoaderConfiguration.Builder config = new ImageLoaderConfiguration.Builder(this);
    // 设置线程优先级
    config.threadPriority(Thread.NORM_PRIORITY - 2);
    // 禁止内存缓存
    config.denyCacheImageMultipleSizesInMemory();
    // 设置磁盘缓存文件名生成器
    config.diskCacheFileNameGenerator(new Md5FileNameGenerator());
    // 设置磁盘缓存大小
    config.diskCacheSize(20 * 1024 * 1024);
    // 设置任务进程执行顺序：先进后出
    config.tasksProcessingOrder(QueueProcessingType.LIFO);
    // 调试使用，若是发布版，需要移除代码
    config.writeDebugLogs();
    // 初始化图片加载器
    ImageLoader.getInstance().init(config.build());
}

/**
 * 回调处理
 */
private GalleryFinal.OnHanlderResultCallback mOnHandlerResultCallback = new GalleryFinal.OnHanlderResultCallback() {
    @Override
    public void onHanlderSuccess(int reqeustCode, List<PhotoInfo> resultList) {
        // 清除原来列表中的图片
        mPhotoList.clear();
        // 返回图片列表
        mPhotoList.addAll(resultList);
        // 刷新页面
        mPhotoAdapter.notifyDataSetChanged();
    }
    @Override
    public void onHanlderFailure(int requestCode, String errorMsg) {
        // 错误提示
        Toast.makeText(Activity.this, errorMsg, Toast.LENGTH_SHORT).show();
    }
};

基于上述代码，可得到效果图如下：

初步效果图

修改源码

通过运行调试，发现框架中有些功能与需求不一致，因此我产生了修改源码的想法，总结需要更改的原功能点如下：

针对以上需要修改的功能，源码修改如下：

// 多图片选择打开相册
GalleryFinal.openGalleryMuti(Constants.REQUEST_CODE_GALLERY, mFunctionConfig, 
       mOnHandlerResultCallback);

所以我们来看看openGalleryMuti方法的源码：


openGalleryMuti方法源码

可以发现，源码中有这么一个判断逻辑：

if (config.getSelectedList() != null && config.getSelectedList().size() > config.getMaxSize()) {
    if(callback != null){
        callback.onHanlderFailure(requestCode, mCoreConfig.getContext().getString(R.string.select_max_tips));
    }
    return;
}

其作用是当选中的图片数量超过最大值时，返回打开本地图片选择器失败的提示信息。之前我们提到，需求中我们实际多显示了一张图片：


“添加”图片

且在配置的时候传入的是添加了一张图片以后的图片列表：

// 不过滤图片，而是将之前选中的图片设置为选中状态
funConBuilder.setSelected(mPhotoList);

所以会导致界面无法跳转，我们有三个策略：
1.将多添加的图片放到adapter里面处理，adapter外部保持选中图片数量与选择页面传入图片的数量一致
2.setSelected传入图片列表之前将mPhotoList移除多出的图片
3.注释掉源码中对图片数量上限的判断

if (mSelectPhotoList.size() > 0) {
    if (!GalleryFinal.getFunctionConfig().isEditPhoto()) {
        resultData(mSelectPhotoList);
    } else {
        toPhotoEdit();
    }
} else {
    // 添加的代码，使未选中图片时也可返回
    resultData(mSelectPhotoList);
}
mSelectPhotoList初始化

考虑到选中图片的列表在声明时已经初始化，所以不用担心图片返回的回调事件传入空指针对象。

public void refreshSelectCount() {
    mTvChooseCount.setText(getString(R.string.selected, mSelectPhotoList.size(), GalleryFinal.getFunctionConfig().getMaxSize()));
    if (mSelectPhotoList.size() > 0 && GalleryFinal.getFunctionConfig().isMutiSelect()) {
        mIvClear.setVisibility(View.VISIBLE);
        if (GalleryFinal.getFunctionConfig().isEnablePreview()) {
            mIvPreView.setVisibility(View.VISIBLE);
        }
    } else {
        mIvClear.setVisibility(View.GONE);
        mIvPreView.setVisibility(View.GONE);
    }
}

当选中图片列表大小为0的时候，隐藏预览按钮；大于0的时候再根据isEnablePreview()来判断是否显示预览按钮。

修改布局和代码逻辑

布局和代码逻辑的修改，其思路与上一节修改源码一样，因需求的效果图功能与GalleryFinal的功能基本一致，逻辑上并不需要做很多的修改，而布局的修改仅涉及到ImageButton变成Button，ImageView变成TextView以及控件位置的调整，在关联控件上和点击事件根据id来判断事件处理上做相应修改即可，在此不做赘述。

总结

使用GalleryFinal订制属于自己的图片选择器并不难，只需要循着需求的功能点，按照代码的逻辑一点点追踪源码并进行修改订制即可。诚恳地说，GalleryFinal框架的可移植性确实很强，在此推荐大家了解一下！

本篇文章的Demo已上传Github，欢迎访问指导！
原创不易，转载请注明链接：http://www.jianshu.com/p/fd5ebfc4725e，谢谢！

上一篇 下一篇

猜你喜欢

热点阅读