2.5 HarmonyOS ArkUI基础组件

@Entry
@Component
struct Imageoage {
  @State imageWidth: number = 150

  build() {
    Row() {
      Column({space:20}) {
        Image('https://pic.cnblogs.com/avatar/3168103/20231128174220.png')
          .width(this.imageWidth)
          .interpolation(ImageInterpolation.High)
        Row() {
          Text($r('app.string.width_lable'))
            .fontSize(20)
            .fontWeight(FontWeight.Bold)
          TextInput({ placeholder: '请输入图片宽度:' })
            .width(150)
            .type(InputType.Number)
            .onChange(value => {
              this.imageWidth = parseInt(value)
            })
        }
        Row({space:20}) {
          Button('放大')
            .onClick(() => {
              if (this.imageWidth <= 300)
                this.imageWidth += 50
            })
          Button('缩小')
            .onClick(() => {
              if (this.imageWidth >= 10) {
                this.imageWidth -= 50
              }
            })
        }
        .justifyContent(FlexAlign.SpaceEvenly)
        Slider({
          min:100,
          max:300,
          value:this.imageWidth,
          step:10
        })
          .width('90%')
          .blockColor('#36D')
          .trackThickness(7)
          .showTips(true)
          .onChange(value=>{
            this.imageWidth = value
          })
      }
      .width('100%')
    }
    .height('100%')
  }
}