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 3次下载
已于2023-3-16 18:59:46修改
收藏
回复
举报
回复
    相关推荐