HarmonyOS【ArkUI组件--TextInput】

1.文本输入框基本用法

2. 使用文本输入框组件(如何实现输入数字改变图片大小)

在此博客的基础上继续编写:HarmonyOS【ArkUI组件--Text】-CSDN博客

①代码如下:

javascript 复制代码
import font from '@ohos.font'
@Entry
@Component
struct Index {
  @State imageWidth:number= 30

  build() {
    Row() {
      Column() {

        Image($r('app.media.app_icon'))
          .width(this.imageWidth)
          .interpolation(ImageInterpolation.High)
        Text($r('app.string.width_label'))
          .fontSize(20)
          .fontWeight(FontWeight.Bold)
        TextInput({text:this.imageWidth.toFixed(0)})
          .width(150)
          .backgroundColor('#36D')
          .type(InputType.Number)
          .onChange(value => {
            this.imageWidth=parseInt(value)
          })
      }

      .width('100%')
    }
    .height('100%')
  }
}

②效果如下


关于博客有任何问题欢迎咨询 ,看见就回😊

相关推荐
花椒技术9 小时前
复杂直播业务做 RN 跨端,我们最后保留了哪些 Native 边界
react native·react.js·harmonyos
不羁的木木11 小时前
《HarmonyOS技术精讲》四:驱动开发入门 ── 标准外设与非标USB串口
驱动开发·华为·harmonyos
不羁的木木12 小时前
《HarmonyOS底部页签-沉浸光感组件实战》高级定制:图标出血与分割线
华为·harmonyos
Goway_Hui14 小时前
【鸿蒙原生应用开发--ArkUI--015】File-manager 文件管理器应用开发教程
华为·harmonyos
不羁的木木16 小时前
《HarmonyOS底部页签-沉浸光感组件实战》基础入门:认识HdsTabs容器与核心配置
华为·harmonyos
不羁的木木16 小时前
《HarmonyOS技术精讲》三:记忆链接 ── 跨场景数据融合
pytorch·华为·harmonyos
2501_9197490316 小时前
鸿蒙 Flutter 实战:image_crop 0.4.1 适配 3.27-ohos 全流程
flutter·华为·harmonyos
祭曦念16 小时前
鸿蒙应用的生命周期与页面跳转:从入门到实战
华为·harmonyos
轻口味17 小时前
HarmonyOS 6.1.1 全栈实战录 - 88 实战 Ability Kit 启动生命周期预热与快照恢复机
华为·harmonyos·鸿蒙
Goway_Hui17 小时前
【鸿蒙原生应用开发--ArkUI--013】Exercise-tracker 运动记录应用开发教程
华为·harmonyos