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

②效果如下


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

相关推荐
Math_teacher_fan9 小时前
Flutter 跨平台开发实战:鸿蒙与音乐律动艺术(六)、Lissajous 利萨茹曲线:频率耦合的轨迹艺术
flutter·ui·数学建模·华为·harmonyos·鸿蒙系统
xmdy586611 小时前
Flutter+开源鸿蒙实战|智安盾电商溯源平台Day3 溯源查询逻辑+鸿蒙网络请求适配
flutter·开源·harmonyos
maaath11 小时前
【maaath】Flutter 跨平台日历日程应用开发实战
flutter·华为·harmonyos
LeesonWong12 小时前
架构困境与四层结构化设计
harmonyos
梦想不只是梦与想13 小时前
鸿蒙 应用市场更新功能:版本检测与更新提醒
harmonyos·鸿蒙·版本更新
xmdy586613 小时前
Flutter+开源鸿蒙实战|智安盾电商溯源平台Day2 首页+核心入口UI开发(鸿蒙多端适配)
flutter·开源·harmonyos
nashane17 小时前
HarmonyOS 6学习:HAR包与HSP包的选择与优化指南
学习·华为·harmonyos·harmonyos 5
全栈若城17 小时前
自定义 TabBar 实战:浮动标签栏与舵式标签栏
harmonyos·harmonyos6·三方库开发
maaath18 小时前
【maaath】Flutter for OpenHarmony 学习答题应用实战开发
学习·flutter·华为·harmonyos
李游Leo18 小时前
别再拼 JSON 了:HarmonyOS UDMF 跨应用数据流转实践
harmonyos