【OpenHarmony】图片缩放浏览组件：PhotoView

简介

图片缩放浏览组件，图片可缩放，平移，旋转

旋转/缩放/平移

下载安装

ohpm  install @ohos/photoview

使用说明

生成 PhotoView

import {PhotoView} from '@ohos/photoview';
...
//创建model对象
 @Local data: PhotoView.Model = new PhotoView.Model();

//设置图片源
aboutToAppear() {
this.data
.setImageResource($rawfile('wallpaper.jpg'))
.setScale(1, false)
.setImageFit(ImageFit.Contain)
.setOnPhotoTapListener({
onPhotoTap(x:number,y:number){
}
})
}
...
//使用PhotoView
PhotoView({model: this.data})

接口说明

1. 设置图片资源

    public setImageResource(src:Resource)
    public setImageURI(src: string)
    public setImageElement(src: PixelMap)

2. 设置图片是否可缩放

    public setZoomable(zoomable: boolean)

3. 设置旋转角度

    public setRotationTo(rotationDegree: number)
    public setRotationBy(rotationDegree: number)

4. 设置图片最大缩放比

    public setMaximumScale(maximumScale: number)

DD一下：欢迎大家关注工粽号<程序猿百晓生>，可以了解到以下知识点。

`欢迎大家关注工粽号<程序猿百晓生>，可以了解到以下知识点。`
1.OpenHarmony开发基础
2.OpenHarmony北向开发环境搭建
3.鸿蒙南向开发环境的搭建
4.鸿蒙生态应用开发白皮书V2.0 & V3.0
5.鸿蒙开发面试真题（含参考答案） 
6.TypeScript入门学习手册
7.OpenHarmony 经典面试题(含参考答案)
8.OpenHarmony设备开发入门【最新版】
9.沉浸式剖析OpenHarmony源代码
10.系统定制指南
11.【OpenHarmony】Uboot 驱动加载流程
12.OpenHarmony构建系统--GN与子系统、部件、模块详解
13.ohos开机init启动流程
14.鸿蒙版性能优化指南
.......

5. 设置图片最小缩放比

    public setMinimumScale(minimumScale: number)

6. 设置中间缩放比

    public setMediumScale(mediumScale: number)

7. 获取当前缩放比

    public getScale(): number

8. 单击监听器

    public setOnClickListener(listener: OnClickListener)

9. 长按监听器

    public setOnLongClickListener(listener: OnLongPressListener)

10. 双击监听器

    public setOnDoubleTapListener(onDoubleTapListener: OnDoubleTapListener)  \

11. matrix监听器

    public setOnMatrixChangeListener(listener: OnMatrixChangedListener)

约束与限制

在下述版本验证通过：

• DevEco Studio: NEXT Beta1-5.0.3.806, SDK: API12 Release(5.0.0.66)

目录结构

|---- PhotoView
    |---- entry
    |     |---- pages  # 示例代码文件夹       
    |---- library 
    |     |---- components  # 库文件夹 
    |     |     |---- PhotoView.ets  # 自定义组件                  
    |     |     |---- RectF.ets  # 区域坐标点数据封装
    |     |---- README.md  # 安装使用方法