goyourfly / Multipictureview
MultiPictureView 是一个将多张图片组合显示并支持添加和删除的控件
Stars: ✭ 120
Programming Languages
kotlin
9241 projects
Projects that are alternatives of or similar to Multipictureview
ionic-multi-camera
Take multiple photos one after another
Stars: ✭ 12 (-90%)
Mutual labels: picture, multiple
V Viewer
Image viewer component for vue, supports rotation, scale, zoom and so on, based on viewer.js
Stars: ✭ 1,776 (+1380%)
Mutual labels: picture
Revogrid
Powerful virtual data grid smartsheet with advanced customization. Best features from excel plus incredible performance 🔋
Stars: ✭ 1,870 (+1458.33%)
Mutual labels: grid
Hot Table
Handsontable - Best Data Grid Web Component with Spreadsheet Look and Feel.
Stars: ✭ 114 (-5%)
Mutual labels: grid
Gis
gis (go image server) go 实现的图片服务,实现基本的上传,下载,存储,按比例裁剪等功能
Stars: ✭ 108 (-10%)
Mutual labels: picture
Flex Grid Lite
Lightweight column grid with the power of flexbox
Stars: ✭ 116 (-3.33%)
Mutual labels: grid
Reactables
GigaTables is a ReactJS plug-in to help web-developers process table-data in applications and CMS, CRM, ERP or similar systems.
Stars: ✭ 112 (-6.67%)
Mutual labels: grid
Pills
A simple responsive CSS Grid for humans. View Demo -
Stars: ✭ 1,482 (+1135%)
Mutual labels: grid
Albumcamerarecorder
一个高效的多媒体支持操作库,可多方面的简单配置操作相册、拍照、录制、录音等功能。也支持配套使用的展示图片、视频、音频的九宫格功能。 (An efficient multimedia support operation library, can be a variety of simple configuration operation album, photo, recording, recording and other functions.Also support supporting the use of the display of pictures, video, audio of the nine grid function.)
Stars: ✭ 106 (-11.67%)
Mutual labels: picture
Stack Up.js
Create fixed width, variable height grid layouts.
Stars: ✭ 117 (-2.5%)
Mutual labels: grid
Smart Webcomponents
Web Components & Custom Elements for Professional Web Applications
Stars: ✭ 110 (-8.33%)
Mutual labels: grid
Bootstrap Grid Css
The grid and responsive utilities classes extracted from the Bootstrap 4 framework, compiled into CSS.
Stars: ✭ 119 (-0.83%)
Mutual labels: grid
MultiPictureView
MultiPictureView是一个可以将多张图片以网格的方式显示的View,通过简单的接口实现烦人的布局,从此解放你的小手手
Demo
Usage
详细的使用请看示例代码
1. 在布局中声明
<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:ratio="1"
app:space="6dp"
app:span="3" />
参数 | 类型 | 说明 | 默认值 |
---|---|---|---|
editable | boolean | 是否可编辑(添加和删除) | false |
span | integer | 每行最多显示多少 | 3 |
ratio | float | 宽高比例 | 1 |
space | dimension | 图片间隔大小 | 8dp |
max | integer | 最多显示多少张图片 | 9 |
imageLayoutMode | integer | 图片布局类型:动态(DYNAMIC=1)和静态(STATIC=2) | STATIC=2 |
deleteDrawable | drawable | 删除图标 | 红色删除Drawable |
addDrawable | drawable | 添加图片 | 灰色添加图片Drawable |
2. 在代码中使用
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) {
...
}
});
Compile
dependencies {
compile 'com.github.goyourfly:multi_picture_view:latestVersion'
}
Thanks
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].