【鸿蒙4.0】harmonyos Day 03

简介: ArkUI组件-Text、ArkUI组件-TextInput:文本输入框简介及用法

一.ArkUI组件-Text

1.Text:文本显示组件

语法:Text(content?:string|Resource)
  • string格式,直接填写文本内容
Text('我是bug天选之子')
  • Resource格式,读取本地资源文件
Text($r('app.string.width_label'))
"app.string.width_label":读取的是resources文件夹下的:
1.zh_CN下面的element下面的string.json文件(中文环境时读取)
2.en_US下面的element下面的string.json文件(英文环境时读取)
3.上面两种文件都没找到就读取base下面的element下面的string.json文件(默认)

1-8-2.png

2.添加文本属性

Text('我是bug天选之子')
.lineHeight(32) // 行高
.fontsize(20) // 字体大小
.fontColor('red') // 字体颜色
.fontWeight(FontWeight.Medium) // 字体粗细

二.ArkUI组件-TextInput:文本输入框

1.声明TextInput组件:

语法:TextTnput({placeholder?:ResourceStr,text?:ResourceStr})
  • placeHolder:占位符,输入框未输入时的提示文本
textInput({placeholder:'请输入账号或者手机号'})
  • text:输入框当前的文本内容
textInput({text:'bug天选之子'})

2.添加属性和事件

TextInput({text:'我是bug天选之子'})
.width(150) // 宽
.height(30) // 高
.backgroundColor("#fff") // 输入框背景颜色
.type(InputType.Password) // 输入框类型(密码)
.onChange(value => {
    // value是用户输入的文本内容
    })

type属性:

Normal:基本输入模式。支持输入数字、字母、下划线、空格、特殊字符。

Password:密码输入模式。支持输入数字、字母、下划线、空格、特殊字符。

Email:邮箱地址输入模式。支持输入数字、字母、下划线,以及@字符。

Number:纯数字输入模式。

PhoneNumber:电话号码输入模式。支持输入数字,以及+、-。

相关文章
|
3月前
|
存储 缓存 5G
鸿蒙 HarmonyOS NEXT端云一体化开发-云存储篇
本文介绍用户登录后获取昵称、头像的方法,包括通过云端API和AppStorage两种方式,并实现上传头像至云存储及更新用户信息。同时解决图片缓存问题,添加上传进度提示,支持自动登录判断,提升用户体验。
179 1
|
3月前
|
存储 负载均衡 数据库
鸿蒙 HarmonyOS NEXT端云一体化开发-云函数篇
本文介绍基于华为AGC的端云一体化开发流程,涵盖项目创建、云函数开通、应用配置及DevEco集成。重点讲解云函数的编写、部署、调用与传参,并涉及环境变量设置、负载均衡、重试机制与熔断策略等高阶特性,助力开发者高效构建稳定云端服务。
400 1
鸿蒙 HarmonyOS NEXT端云一体化开发-云函数篇
|
3月前
|
存储 JSON 数据建模
鸿蒙 HarmonyOS NEXT端云一体化开发-云数据库篇
云数据库采用存储区、对象类型、对象三级结构,支持灵活的数据建模与权限管理,可通过AGC平台或本地项目初始化,实现数据的增删改查及端侧高效调用。
177 1
|
3月前
|
存储 开发者 容器
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
本文介绍了ArkTS语言中的Class类、泛型、接口、模块化、自定义组件及状态管理等核心概念,并结合代码示例讲解了对象属性、构造方法、继承、静态成员、访问修饰符等内容,同时涵盖了路由管理、生命周期和Stage模型等应用开发关键知识点。
329 1
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
|
3月前
鸿蒙 HarmonyOS NEXT星河版APP应用开发-阶段三
本文介绍了UI开发中的样式复用与组件构建技术,涵盖@Extend、@Styles和@Builder的使用方法,并通过Swiper轮播、Scroll滚动、Tabs导航等常用组件实现典型界面效果,结合生肖抽卡、小米轮播、回顶按钮等案例,展示实际应用技巧。
132 1
|
3月前
鸿蒙 HarmonyOS NEXT星河版APP应用开发-阶段二
本文介绍鸿蒙应用界面开发中的弹性布局(Flex)、绝对定位、层叠布局及ArkTS语法进阶,涵盖字符串拼接、类型转换、数组操作、条件与循环语句,并结合B站视频卡、支付宝首页等案例,深入讲解点击事件、状态管理与界面交互功能。
285 1
鸿蒙 HarmonyOS NEXT星河版APP应用开发-阶段二
|
6月前
|
传感器 移动开发 API
【HarmonyOS 5】鸿蒙中的UIAbility详解(一)
HarmonyOS 5 中的 UIAbility 是应用框架的核心组件,负责管理用户界面生命周期和上下文信息。它类似于 Android 的 Activity 或 iOS 的 UIViewController,主要用于与用户交互。本文详细解析了 UIAbility 的基本概念、启动页面设置、上下文获取、生命周期管理及常用操作(如终止实例、跨 Ability 信息传递)。
673 9
|
Android开发
HarmonyOS(鸿蒙)——长按事件
HarmonyOS(鸿蒙)——长按事件
536 0
HarmonyOS(鸿蒙)——长按事件
|
2月前
|
移动开发 前端开发 Android开发
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
295 12
【02】建立各项目录和页面标准化产品-vue+vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
|
2月前
|
移动开发 JavaScript 应用服务中间件
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡
252 5
【06】优化完善落地页样式内容-精度优化-vue加vite开发实战-做一个非常漂亮的APP下载落地页-支持PC和H5自适应提供安卓苹果鸿蒙下载和网页端访问-优雅草卓伊凡

热门文章

最新文章