[文章]Harmony/OpenHarmony应用开发-矩阵变换

阅读量0
1
3

可对图形进行平移、旋转和缩放等。
说明:从API Version 7开始支持。开发语言ets.

导入模块:import matrix4 from ‘@ohos.matrix4’

Harmony/OpenHarmony应用开发-矩阵变换-开源基础软件社区

示例代码:

import matrix4 from '@ohos.matrix4';

// 创建一个四阶矩阵
let matrix1 = matrix4.init([1.0, 0.0, 0.0, 0.0,
0.0, 1.0, 0.0, 0.0,
0.0, 0.0, 1.0, 0.0,
0.0, 0.0, 0.0, 1.0])

let matrix2 = matrix4.identity()

@Entry
@Component
struct MatrixTransformation {
  private matrix1 = matrix4.identity().translate({x:100})
  private matrix2 = this.matrix1.copy().scale({x:2})

  [url=home.php?mod=space&uid=2743618]@builder[/url] init(){
    Column() {
      Image($r("app.media.icon"))
        .width("40%")
        .height(100)
        .transform(matrix1)
    }
  }

  @Builder identity(){
    Column() {
      Image($r("app.media.icon"))
        .width("40%")
        .height(100)
        .transform(matrix1)
      Image($r("app.media.icon"))
        .width("40%")
        .height(100)
        .margin({ top: 150 })
        .transform(matrix2)
    }
  }

  @Builder copy(){
    Column() {
      Image($r("app.media.icon"))
        .width("40%")
        .height(100)
        .transform(this.matrix1)
      Image($r("app.media.icon"))
        .width("40%")
        .height(100)
        .margin({top:50})
        .transform(this.matrix2)
    }
  }

  build() {
    Column(){
      this.init()
      this.identity()
      this.copy()
    }
  }
}

示例效果:
![Harmony/OpenHarmony应用开发-矩阵变换-开源基础软件社区](//file.elecfans.com/web2/M00/84/81/pYYBAGOcJCKAHEl6AADMKYTOyng570.jpg "Harmony/OpenHarmony应用开发-矩阵变换-开源基础软件社区")
代码地址:[https://e.gitee.com/jltfcloudcn/repos/jltfcloudcn/jump_to/tree/master/AnimationMuster](https://e.gitee.com/jltfcloudcn/repos/jltfcloudcn/jump_to/tree/master/AnimationMuster)

参考地址:[https://developer.harmonyos.com/cn/docs/documentation/doc-references-V3/ts-matrix-transformation-0000001430440725-V3](https://developer.harmonyos.com/cn/docs/documentation/doc-references-V3/ts-matrix-transformation-0000001430440725-V3)

回帖

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容图片侵权或者其他问题,请联系本站作侵删。 侵权投诉
链接复制成功,分享给好友