回复
OpenHarmony三方组件：LargeImage
Handpc
发布于 2023-3-16 18:59
浏览
0收藏
简介
加载可以执行缩放（放大和缩小）和滚动操作的图像，图像放大之后可以拖动查看。
详细功能： 1.加载图像。 2.支持缩放。 3.支持拖动查看大图。
下载安装
npm install @ohos/LargeImage --save
OpenHarmony npm环境配置等更多内容，请参考如何安装OpenHarmony npm
使用说明
import {LargeImage} from '@ohos/LargeImage'; // 导入库的代码
@Entry
@Component
struct Index {
@State model: LargeImage.Model = new LargeImage.Model() //创建模型
@State rotate: number =0;
private aboutToAppear() {
this.model.setImage($r('app.media.card')); // 设置图片资源
this.model.setMaxScale(2); // 设置图片最大缩放比例
}
build() {
Stack({ alignContent: Alignment.Bottom }) {
LargeImage({ model: this.model }) // 加载大图对象
Image($r('app.media.rotate'))
.width(30)
.height(30)
.margin({ top: 6 ,left:10,right:20})
.onClick((event: ClickEvent) => {
this.rotate +=90;
this.model.setOrientation(this.rotate) // 设置图片旋转角度
})
}
}
}
接口说明
接口名 | 参数 | 返回值 | 说明 |
setImage | src: Resource | void | 设置图像资源 |
setZoomEnabled | zoomEnabled: boolean | void | 设置是否可以缩放图像。 |
setPanEnabled | panEnabled: boolean | void | 设置是否可以平移图像。 |
setMaxScale | maxScale: number | void | 设置图像的最大缩放比例。 |
setOrientation | degrees: number | void | 设置图像旋转角度 |
getLoadedImageWidth getLoadedImageHeight | 无 | number | 获取源图像的宽度和高度 |
setSingleTapListener | listener: OnSingleTapListener | void | 设置单击事件监听器 |
setLongPressListener | listener: OnLongPressListener | void | 设置长按事件监听器 |
setDoubleTapListener | listener: OnDoubleTapListener | void | 设置双击事件监听器 |
兼容性
支持OpenHarmony API version 9 及以上版本
目录结构
|---- LargeImage
| |---- entry # 示例代码文件夹
| |---- LargeImage # LargeImage库文件夹
| |---- LargeImage.ets # LargeImage对外接口
| |---- README.md # 安装使用方法
贡献代码
使用过程中发现任何问题都可以提Issue 给我们，当然，我们也非常欢迎你给我们提PR。
开源协议
本项目基于 Apache License 2.0，请自由地享受和参与开源。
文章转载自：https://gitee.com/openharmony-tpc/LargeImage
分类
标签
LargeImage-master.zip 10.71M 0次下载
已于2023-3-16 18:59:46修改
赞
收藏
回复
相关推荐
