鸿蒙基本UI控件(Text相关-含项目创建流程)

1.开发准备:(登录华为账号,下载开发工具:DevEco Studio)

开发-HarmonyOS NEXT鸿蒙应用开发平台-华为开发者联盟

2.创建项目,选择ArkUI项目:

3.找到文件: pages目录下的Index.ets

TypeScript 复制代码
@Entry
@Component
struct Index {
  @State message: string = '默认文案';
  @State input: string = '默认输入框内容';

  setText(value: string){ //将输入框的内容赋值到第一个TextView
    this.message = value;
    if (value =="") {
      this.message = '默认文案'
    }
  }

  build() {
    Row() { //水平居中
      Column() { //垂直居中
        Text(this.message)
          .fontSize($r('app.float.page_text_font_size'))
          .fontWeight(FontWeight.Bold)
          .onClick(() => {
            this.message = 'Welcome';
          })
        Text('(点击恢复默认文案)')
          .fontSize('28fp')
          .fontWeight(FontWeight.Bold)
          .background($r('app.color.textBack'))
          .onClick(() => {
            this.message = '默认文案';
          })
          .id("Two")
        //多行输入框
        TextArea({
          text: this.input,
          placeholder: "请输入文本" })
          .fontSize(34)
          .onChange((value: string)  => {
            //将输入框的内容赋值到第一个TextView
            this.setText(value)
          })

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

4、运行结果:

  • 输入框的内容会同步更新到第一个Text(包含初始的默认代码更新)
  • 点击粉色背景的Text会恢复第一个Text的文案为"默认文案"
相关推荐
贾伟康40 分钟前
【共创稿事节】HarmonyOS 7.0 AOT编译优化:从接入到生产验证
harmonyos·arkts·路由·navigation·navdestination
2601_949480061 小时前
开源鸿蒙平台 CMP 三方库「shadcn」适配全流程
华为·开源·harmonyos
Liaiyang663 小时前
空圈容错视角-HarmonyOS 7 架构体检:从被动容错到主动免疫的真伪验证与生态反推
操作系统·harmonyos·架构设计·ai-agent·端云协同·鸿蒙7·空圈容错
贾伟康3 小时前
【共创稿事节】HarmonyOS 7.0 Native XComponent与FFI:从接入到生产验证
harmonyos·profiler·hitracemeter·性能追踪·时间线
redtank20004 小时前
纯血鸿蒙本地电子书阅读器实测:九格式支持、沉浸阅读与零联网隐私设计
华为·harmonyos
贾伟康4 小时前
【共创稿事节】HarmonyOS 7.0 HiSysEvent系统事件订阅:从接入到生产验证
harmonyos·可观测性·hisyevent·系统事件·后台优化
独隅7 小时前
HarmonyOS 系统能力与体验深度评测 - 超详细版
华为·harmonyos
懿路向前8 小时前
唤醒工作台全实录(六):数据层——5ms 竞态窗口与“查询即引用“
华为·架构·harmonyos
KevinChaos8 小时前
灶台菜谱设计手记 04|HarmonyOS 7.0 空间化:信息折叠展开
harmonyos
贾伟康10 小时前
【共创稿事节】HarmonyOS 7.0 HiTraceChain分布式调用链:从接入到生产验证
分布式·harmonyos·可观测性·调用链·hitracechain