#鸿蒙通关秘籍#如何在HarmonyOS中预先计算并调整图片的默认显示尺寸?

HarmonyOS
5天前
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
EPC梦织星

为了在HarmonyOS中正确计算图片的默认尺寸和比例,可以遵循以下实现思路:

  1. 初始化当前图片的信息:

    initCurrentImageInfo(): void {
        this.matrix = matrix4.identity().copy();
        const imageSource: image.ImageSource = image.createImageSource(this.imageUri);
        imageSource.getImageInfo(0).then((data: image.ImageInfo) => {
            this.imageWHRatio = data.size.width / data.size.height;
            this.imageDefaultSize = this.calcImageDefaultSize(this.imageWHRatio, windowSizeManager.get());
            this.fitWH = this.imageDefaultSize.width === windowSizeManager.get().width ? "width" : "height";
            this.imageScaleInfo.maxScaleValue += this.fitWH === "width" ? 
                (windowSizeManager.get().height / this.imageDefaultSize.height) : 
                (windowSizeManager.get().width / this.imageDefaultSize.width);
        }).catch((err: BusinessError) => {
            console.error(`[error][getImageInfo]${err.message}`);
        });
        imageSource.createPixelMap().then((data: image.PixelMap) => {
            this.imagePixelMap = data;
        }).catch((err: BusinessError) => {
            console.error(`[error][createPixelMap]${err.message}`);
        });
    }
    
  2. 使用预设宽度、高度及比例显示图片:

    Image(this.imagePixelMap)
        .width(this.fitWH === "width" ? $r("app.string.image_default_width") : undefined)
        .height(this.fitWH === "height" ? $r("app.string.image_default_height") : undefined)
        .aspectRatio(this.imageWHRatio)
    

    根据图片的实际宽高比设置宽度或高度,并通过aspectRatio属性使图片按比例显示。为了提升性能和用户体验,可通过窗口大小信息和实际的图片比例来计算默认尺寸,实现自适应显示。

分享
微博
QQ
微信
回复
5天前
相关问题