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%')
  }
}

②效果如下


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

相关推荐
2301_822703201 小时前
鸿蒙Flutter第三方库FlutterUnit组件百科适配——具体示例还原演示1
算法·flutter·华为·harmonyos·鸿蒙
前端不太难1 小时前
一天做出:鸿蒙 + AI 游戏 Demo
人工智能·游戏·harmonyos
木斯佳4 小时前
HarmonyOS 6实战:AI Action富媒体卡片迭代——实现快照分享
人工智能·harmonyos·媒体
不爱吃糖的程序媛9 小时前
适配鸿蒙PC sha_ohos.patch 补丁文件详解
华为·harmonyos
AI_零食9 小时前
声音分贝模拟与波动动画展示:鸿蒙Flutter框架 实现的声音可视化应用
学习·flutter·华为·开源·harmonyos
SoraLuna11 小时前
「鸿蒙智能体实战记录 10」节气知识展示卡片开发与工作流绑定实现
华为·harmonyos
autumn200512 小时前
Flutter 框架跨平台鸿蒙开发 - 颜色情绪
flutter·华为·harmonyos
Utopia^12 小时前
Flutter 框架跨平台鸿蒙开发 - 记忆热力图
flutter·华为·harmonyos
2301_8227032012 小时前
Flutter 框架跨平台鸿蒙开发 - 创意声音合成器应用
算法·flutter·华为·harmonyos·鸿蒙
李李李勃谦13 小时前
Flutter 框架跨平台鸿蒙开发 - 创意灵感收集
android·flutter·harmonyos