源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

Android 图片网格布局控件示例代码

  • 时间:2021-02-21 10:57 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:Android 图片网格布局控件示例代码
项目地址:[url=https://github.com/goyourfly/MultiPictureView]MultiPictureView[/url] MultiPictureView是一个可以将多张图片以网格的方式显示的View,通过简单的接口实现烦人的布局,从此解放你的小手手 [b]显示效果[/b] [list=1] [*]支持设置图片数量上限[/*] [*]支持设置最多显示列数[/*] [*]支持动态布局和静态布局两种模式(见下图)[/*] [*]支持编辑模式和展示模式(编辑模式可以增加和删除图片)[/*] [/list] [b]布局方式[/b] [img]http://files.jb51.net/file_images/article/201706/201706280928441.png[/img] 动态布局 [img]http://files.jb51.net/file_images/article/201706/201706280928442.png[/img] 静态布局 [b]编辑/显示模式[/b] [img]http://files.jb51.net/file_images/article/201706/201706280928453.png[/img] [img]http://files.jb51.net/file_images/article/201706/201706280928454.png[/img] [b]如何使用[/b] [b]1. 在布局中声明[/b]
<com.goyourfly.multi_picture.MultiPictureView
  android:id="@+id/multi_image_view"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  app:editable="false"
  app:deleteDrawable="@drawable/..."
  app:addDrawable="@drawable/..."
  app:imageLayoutMode="DYNAMIC"
  app:max="9"
  app:space="6dp"
  app:span="3" />
参数 类型 说明 默认值
editable boolean 是否可编辑(添加和删除) false
span integer 每行最多显示多少 3
space dimension 图片间隔大小 8dp
max integer 最多显示多少张图片 9
imageLayoutMode integer 图片布局类型:动态(DYNAMIC=1)和静态(STATIC=2) STATIC=2
deleteDrawable drawable 删除图标 红色删除Drawable
addDrawable drawable 添加图片 灰色添加图片Drawable
[b]2. 在代码中使用[/b] 2.1 初始化ImageLoader
MultiPictureView.setImageLoader(object : ImageLoader {
  override fun loadImage(image: ImageView, uri: Uri) {
    Vincent.with(image.context)
        .load(uri)
        .placeholder(R.drawable.ic_placeholder_loading)
        .error(R.drawable.ic_placeholder_loading)
        .into(image)
  }
})
2.2 绑定图片资源,设置事件监听
multiPictureView = (MultiPictureView) findViewById(R.id.multi_image_view);
// 设置图片资源
multiPictureView.setList(list:List<Uri>)
multiPictureView.setAddClickCallback(new MultiPictureView.AddClickCallback() {
  @Override
  public void onAddClick(View view) {
    // 添加图片回调...
  }
});
multiPictureView.setDeleteClickCallback(new MultiPictureView.DeleteClickCallback() {
  @Override
  public void onDeleted(View view,int index) {
    // 删除图片回调,如果不设置,默认删除图片...
  }
});
multiPictureView.setItemClickCallback(new MultiPictureView.ItemClickCallback() {
  @Override
  public void onItemClicked(View view,int index,ArrayList<Uri> uris) {
    // 图片被点击...
  }
});
[b]依赖[/b] 第一步:添加到根build.gradle
allprojects {
  repositories {
    ...
    jcenter()
  }
}
第二步:在模块的build.gradle添加依赖
dependencies {
  compile 'com.github.goyourfly:multi_picture_view:latestVersion'
}
[b]感谢[/b] 在Demo中使用了下面两个开源项目,感谢一哈,虽然第二个是我写的...大家要觉得好用,记得给我点个赞 [url=https://github.com/zhihu/Matisse]Matisse[/url] [url=https://github.com/goyourfly/Vincent]Vincent[/url] 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程素材网。
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部