@TOC

UploadMultiImageView 多图上传组件

项目中经常会有多图上传的需求，每次都重复写，实在不是一个好办法。于是基于 【recycleview】 来实现一个仅仅需要 【十几行代码】 就可拥有拖拽排序功能的多图上传组件。

目前使用的AndroidX，不是的同学，请尽快升级吧！

先看效果

UploadMultiImageView源码传送门

使用说明

1、在根目录 build.gradle 添加:

allprojects {
		repositories {
			...
			maven { url 'https://jitpack.io' }
		}
	}

2、在module项目下的build.gradle中添加：

dependencies {
	        implementation 'com.gitee.mtj_java:UploadMultiImageView:1.1.0'
	}

3、在布局xml中添加组件

<cn.mtjsoft.multiimagelibrary.UploadMultiImageView
        android:id="@+id/uploadMultiImageView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="#fff"
        app:addRes="@drawable/img_add"
        app:deleteRes="@drawable/img_delete"
        app:column_count="3"
        app:is_Drag="true"
        app:is_showAdd="true"
        app:item_spacing="2dp"
        app:max_count="9" />

版本及自定义属性说明

V1.1.0

新增方法：

// 设置图片缩放类型 (默认 CENTER_CROP)
setScaleType(ImageView.ScaleType.CENTER_CROP);
// 设置删除点击监听（如果不设置，默认直接移除数据），自己处理过程
setDeleteClickListener();

V1.0.0

代码实现（这里用kotlin写的）

1、Activity

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        // 循环添加几条数据
        val list: MutableList<ImageModel> = ArrayList()
        for (i in 0..7) {
            val model = ImageModel()
            model.path = R.mipmap.android
            list.add(model)
        }

        /**
        * 核心实现在这里
        */
        uploadMultiImageView
                    .setImageInfoList(list.toList())
                    // 所有属性都可以在代码中再设置
                    // 开启拖拽排序
                    .setDrag(true)
                    // 设置每行3列
                    .setColumns(3)
                    // 显示新增按钮
                    .setShowAdd(true)
                    // 设置图片缩放类型 (默认 CENTER_CROP)
                    .setScaleType(ImageView.ScaleType.CENTER_CROP)
                    // item点击回调
                    .setImageItemClickListener { position ->
                        // imageview点击
                        Toast.makeText(baseContext, "点击第了${position}个", Toast.LENGTH_SHORT).show()
                    }
                    // 设置删除点击监听（如果不设置，测试默认移除数据），自己处理数据删除过程
                    .setDeleteClickListener { multiImageView, position ->
                        AlertDialog.Builder(this)
                            .setTitle("删除")
                            .setMessage("确定要删除图片吗？")
                            .setNegativeButton("确定") { dialog, which ->
                                dialog.dismiss()
                                multiImageView.deleteItem(position)
                            }
                            .show()
                    }
                    // 图片加载
                    .setImageViewLoader { context, path, imageView ->
                        // （这里自己选择图片加载框架，不做限制）
                        imageView.setImageResource(path as Int)
                    }
                    // 新增按钮点击回调
                    .setAddClickListener {
                        // 模拟新增一条数据
                        addNewData()
                    }
                    .show()
    }

    /**
     * 新增一条或多条数据
     */
    private fun addNewData() {
        val tempList: MutableList<ImageModel> = ArrayList()
        val model = ImageModel()
        model.path = R.mipmap.android
        tempList.add(model)
        // 调用新增数据
        uploadMultiImageView.addNewData(tempList.toList())
    }
}

2、数据实体类 实现 ImageInfo

/**
 * 实现 ImageInfo
 */
public class ImageModel implements ImageInfo {

    private Object path;

    public Object getPath() {
        return path;
    }

    public void setPath(Object path) {
        this.path = path;
    }

    /**
     * @return 图片地址
     */
    @Override
    public Object getImagePath() {
        return path;
    }

    /**
     * @return 固定返回 false
     */
    @Override
    public boolean isLastAddViewData() {
        return false;
    }
}

完结

怎么样？是不是十分的简洁，核心实现是不是只有仅仅十几行代码？

本人公众号，关注一波，共同交流吧。