HarmonyOS鸿蒙Next中ImageAnimator的ImageFrameInfo如何设置不同大小

HarmonyOS鸿蒙Next中ImageAnimator的ImageFrameInfo如何设置不同大小 .images([{ src: $r(‘app.media.frame_0’), width:65, height:65 }, { src: $r(‘app.media.frame_1’), width:45, height:65 }, { src: $r(‘app.media.frame_2’), width:24, height:65 }, { src: $r(‘app.media.frame_3’), width:4, height:65 }, { src: $r(‘app.media.frame_4’), width:24, height:65 } , { src: $r(‘app.media.frame_5’), width:45, height:65 } , { src: $r(‘app.media.frame_6’), width:65, height:65}]) 我尝试设置不同的width 但结果依旧都过时一样大


更多关于HarmonyOS鸿蒙Next中ImageAnimator的ImageFrameInfo如何设置不同大小的实战教程也可以访问 https://www.itying.com/category-93-b0.html

4 回复

添加下此属性：.fixedSize(false)，默认为true,图片跟随组件大小；

https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-basic-components-imageanimator-V5#fixedsize

更多关于HarmonyOS鸿蒙Next中ImageAnimator的ImageFrameInfo如何设置不同大小的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


检查一下fixedSize属性（设置图片大小是否固定为组件大小）是否没有设置。

该属性默认为true,表示图片大小与组件大小一致，此时设置图片的width 、height 、top 和left属性是无效的。

如果要单独设置每张图片大小，需设置该属性为false。

在HarmonyOS鸿蒙Next中，ImageAnimator组件的ImageFrameInfo用于定义动画帧的属性。要设置不同大小的帧，可以通过在ImageFrameInfo中为每一帧指定不同的width和height属性来实现。例如：

let imageFrameInfo: image.ImageFrameInfo[] = [
  { src: 'common/images/frame1.png', width: 100, height: 100 },
  { src: 'common/images/frame2.png', width: 150, height: 150 },
  { src: 'common/images/frame3.png', width: 200, height: 200 }
];

ImageAnimator({
  images: imageFrameInfo,
  state: AnimationStatus.Playing,
  duration: 1000
}).width('100%').height('100%')

在上述代码中，ImageFrameInfo数组中的每一帧都设置了不同的width和height，从而实现了不同大小的帧动画效果。

在HarmonyOS鸿蒙Next中，ImageAnimator的ImageFrameInfo可以通过设置width和height属性来调整每一帧图像的大小。你可以在创建ImageFrameInfo时，为每一帧指定不同的宽度和高度。例如：

let frameInfo: ImageFrameInfo = {
    src: $r('app.media.frame1'),
    width: 100,
    height: 100
};

如果需要不同帧有不同大小，只需为每一帧分别设置width和height即可。

回到顶部