HarmonyOS 图片底部对齐，缩放后，顶部超出作裁剪？

Question

如题：HarmonyOS 图片底部对齐，缩放后，顶部超出作裁剪？

Answer 1

参考demo如下：

@Entry
@Component
struct Index {
  @State message: string = 'Hello World';
  @State compHeight: number = 0;

  // 发现瘦高型图片撑开后，总是会居中位置
  build() {
    Flex() {
      Row(){
        // 容器高度由内容撑开
        Text('测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容测试内容')
          .fontColor(Color.Black)
        // objectFit内的值有其他值，可以按业务选
        Image($r('app.media.111')).objectFit(ImageFit.BOTTOM_START)
          .position({x: 0, y: 0})
          .zIndex(-1).height(this.compHeight).width("100%")
      }
      // .backgroundImageSize({ width: "100%", height: "100%" })
      // .backgroundImagePosition(Alignment.BottomStart)
      .width("100%")
      .onAreaChange((oldValue: Area, newValue: Area) => {
        this.compHeight = newValue.height as number
      })
    }
    .width('100%')
  }
}

可用媒体的图片处理对图片进行高度裁剪

pixelMap.crop({x: 0, y: 20, size: { height: 400, width: 400 } });

可通过设置开始裁剪位置y的值实现从上到下裁剪。参考文档：

https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/image-transformation-V5