小程序 - 图片
image
属性
属性名称 | 默认值 | 说明 |
---|---|---|
图片地址 | 无 | 图片地址路径 |
动态图片地址 | 无 | 动态图片地址路径。(数据集图片列、文件列、或图片地址路径) |
图片链接保护 | 否 | 针对绑定数据集中图片列或文件列字段。是否每次请求文件服务器加载图片。 |
点击预览图片 | 否 | 点击图片放大预览 |
预定义图片模式 | scaleToFill | 图片裁剪、缩放的模式 |
事件
名称 | 说明 |
---|---|
加载失败 | 当错误发生时触发 |
加载完毕 | 当图片载入完毕时触发 |
mode有效值
模式 | 值 | 说明 |
---|---|---|
缩放 | scaleToFill | 不保持纵横比,图片完全拉伸填充满image元素。 |
缩放 | aspectFit | 保持纵横比,根据图片较长边缩放图片,将图片完整显示出来。 |
缩放 | aspectFill | 保持纵横比缩放图片,图片较短边能够完全显示出来。也就是说,图片通常只在水平或垂直方向是完整的,另一个方向将会发生截取。 |
缩放 | widthFix | 库单独不变,高度自动变化,保持纵横比不变。 |
裁剪 | top | 不缩放图片,只显示图片顶部区域 |
裁剪 | center | 不缩放图片,只显示图片的中间区域 |
裁剪 | left | 不缩放图片,只显示图片的左边区域 |
裁剪 | right | 不缩放图片,只显示图片的右边区域 |
裁剪 | top-left | 不缩放图片,只显示图片的左上边区域 |
裁剪 | top-right | 不缩放图片,只显示图片的右上边区域 |
裁剪 | bottom-left | 不缩放图片,只显示图片的左下边区域 |
裁剪 | bottom-right | 不缩放图片,只显示图片的右下边区域 |
示例
原图