48.HarmonyOS鸿蒙系统 App(ArkUI)常用组件的使用

embedded/2025/2/1 8:44:52/

48.HarmonyOS鸿蒙系统 App(ArkUI)常用组件的使用

按钮触发事件

toast信息提示

单选按钮

复选框

切换按钮,开关按钮

进度条

textbox,textinput,TextArea文本输入框

气泡提示

import prompt from '@ohos.prompt';
import promptAction from '@ohos.promptAction';
@Entry
@Component
struct Index {@State message: string = 'Hello World'@State handlePopup: boolean = falsebuild() {Column(){Row(){Text('常用组件的使用').fontSize(38).fontColor(Color.White)}.backgroundColor(Color.Blue)Row(){Text('文本组件').fontSize(38).fontColor(Color.White).align(Alignment.Center)}.backgroundColor(Color.Blue)Row(){Button('按钮组件').fontSize(32).fontColor(Color.White).onClick(()=>{promptAction.showToast({message: "默认Toast提示信息显示"})})Button('按钮组件2').fontSize(32).fontColor(Color.White).onClick(()=>{promptAction.showToast({message: "参数配置toast显示", // 显示文本duration: 3000,              // 显示时长,3秒bottom: 500})})}.backgroundColor(Color.Blue)Row(){Radio({ value: 'Radio1', group: 'radioGroup' }).height(50).width(50).onChange((isChecked: boolean) => {if(isChecked) {// 切换promptAction.showToast({ message: '单选1' })}})Radio({ value: 'Radio2', group: 'radioGroup' }).height(50).width(50).onChange((isChecked: boolean) => {if(isChecked) {// 切换promptAction.showToast({ message: '单选2' })}})Radio({ value: 'Radio3', group: 'radioGroup' }).height(50).width(50).onChange((isChecked: boolean) => {if(isChecked) {// 切换promptAction.showToast({ message: '单选3' })}})}.backgroundColor(Color.Green)Row(){Text('单选按钮')}.backgroundColor(Color.Green)Row(){Toggle({ type: ToggleType.Checkbox, isOn: false })Text('复选框,切换按钮1')}Row(){Toggle({ type: ToggleType.Checkbox, isOn: true })Text('复选框,切换按钮2')}Row(){Toggle({ type: ToggleType.Switch, isOn: false })Text('开关按钮1')Toggle({ type: ToggleType.Switch, isOn: true })Text('开关按钮2')}Row(){Progress({ value: 24, total: 100, type: ProgressType.Linear })Text('进度条')}Row(){Text('类别:')TextInput({text:'文本输入信息'}).backgroundColor(Color.Yellow)}Row(){Text('专业:')TextArea({text:'TextArea信息可以自动换行,。。。。。。。。。。。,' +'非常方便,非常有用'}).backgroundColor(Color.Orange)}Row(){Button('气泡提示').onClick(()=>{this.handlePopup = !this.handlePopup}).bindPopup(this.handlePopup, {message: '这是气泡提示信息',})}.backgroundColor(Color.Orange)}}
}


http://www.ppmy.cn/embedded/7494.html

相关文章

开源数据库postgresql在统信系统上的离线安装

统信系统上的安装: 创建目录 [rootlocalhost ~]# cd /home/ [rootlocalhost home]# mkdir postgres 上传文件 在当前目录解压,并安装依赖包 tar zxvf postgresql-15.4.tar.gz mv postgresql-15.4 postgresql rpm -ivh --force --nodeps *.rpm 预…

.net 6.0如何直接读取appsetting.json配置文件

现在有一个appsetting.json配置文件,里面有个setting下的url地址,需要读取,如下: {"Logging": {"LogLevel": {"Default": "Information","Microsoft": "Warning",&…

探索通过GPT和云平台搭建网安实战培训环境

项目背景 网络安全是一个不断演变的领域,面临着日益复杂的挑战和不断扩大的威胁。数字化时代,随着勒索攻击、数据窃取、网络钓鱼等频频出现,网络攻击的威胁指数和影响范围进一步增加,如何防范网络攻击,确保数据安全&a…

OpenHarmony网络通信-socket-io

简介 socket.io是一个在客户端和服务器之间实现低延迟、双向和基于事件的通信的库。建立在 WebSocket 协议之上,并提供额外的保证,例如回退到 HTTP 长轮询或自动重新连接。 效果展示 下载安装 ohpm install ohos/socketio OpenHarmony ohpm 环境配置等更…

go语言基础 -- 反射

反射的基本介绍 反射可以在运行时动态获取变量的信息,如变量的类型(type),类别(kind)。如果是结构体变量,还可以获取到变量的字段、方法等结构体本身信息;通过反射,可以修改变量的值或调用关联…

高职人工智能综合实训案例之Al分类模型实战

一、案例背景 随着信息技术的迅猛发展,人工智能已经成为引领新一轮科技革命和产业变革的重要驱动力。特别是在大数据和云计算技术的支持下,AI分类模型在各个领域展现出广阔的应用前景。无论是图像识别、语音识别,还是自然语言处理&#xff0…

HAL STM32 I2C方式读取MT6701磁编码器获取角度例程

HAL STM32 I2C方式读取MT6701磁编码器获取角度例程 📍相关篇《Arduino通过I2C驱动MT6701磁编码器并读取角度数据》🎈《STM32 软件I2C方式读取MT6701磁编码器获取角度例程》📌MT6701当前最新文档资料:https://www.magntek.com.cn/u…

什么是渐进式框架

渐进式框架是一种设计理念,它允许开发者根据项目需求逐步采用框架的功能。这意味着你可以从一个非常轻量、简洁的开始,根据实际需要不断引入更多的组件和功能。这种方式的好处在于它使得项目的起点低、上手快,同时随着项目的增长,…