openHarmony UI开发

常用组件和布局方式

组件

        ArkUI有丰富的内置组件,包括文本、按钮、图片、进度条、输入框、单选框、多选框等。和布局一样,我们也可以将基础组件组合起来,形成自定义组件。


按钮:

Button('Ok', { type: ButtonType.Normal, stateEffect: true }) .borderRadius(8) .backgroundColor(0x317aff) .width(90).height(40)


单选框:

Radio({ value: 'Radio1', group: 'radioGroup' }).checked(false)
Radio({ value: 'Radio2', group: 'radioGroup' }).checked(true)


切换按钮:

Toggle({ type: ToggleType.Checkbox, isOn: false })
Toggle({ type: ToggleType.Checkbox, isOn: true })


进度条:

Progress({ value: 24, total: 100, type: ProgressType.Linear }) // 创建一个进度总长为100,初始进度值为24的线性进度条


文本:

Text("你好").fontSize(50).fontWeight(FontWeight.Bold)


文本输入框:

TextInput()


还有更多的组件可以到OpenHarmony官网进行查看,下面是一些组件的示例图:

布局方式

        线性布局、层叠布局、弹性布局、相对布局、栅格布局、列表、宫格、轮播等。布局与布局之间可以互相嵌套,组合完成更加复杂的页面布局,我们可以根据实际需求来进行组合布局。


线性布局:

Column容器内子元素排列示意图                                Row容器内子元素排列示意图

         

示例如下:


层叠布局


弹性布局


网格布局

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/112959.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

C# Onnx Yolov8 Detect 烟雾检测

效果 项目 代码 using Microsoft.ML.OnnxRuntime; using Microsoft.ML.OnnxRuntime.Tensors; using OpenCvSharp; using System; using System.Collections.Generic; using System.Drawing; using System.Linq; using System.Text; using System.Windows.Forms;namespace Onnx…

用Python解析HTML页面

用Python解析HTML页面 文章目录 用Python解析HTML页面HTML 页面的结构XPath 解析CSS 选择器解析简单的总结 在前面的课程中,我们讲到了使用 request三方库获取网络资源,还介绍了一些前端的基础知识。接下来,我们继续探索如何解析 HTML 代码&…

leetcode做题笔记191. 位1的个数

编写一个函数,输入是一个无符号整数(以二进制串的形式),返回其二进制表达式中数字位数为 1 的个数(也被称为汉明重量)。 提示: 请注意,在某些语言(如 Java)中…

Python超入门(5)__迅速上手操作掌握Python

# 20.列表# 一维列表 names [Hash, Bob, Nick] print(names) # 全打印 print(names[:]) # 全打印 print(names[1:3]) # 打印1到2号索引 print(names[:2]) # 打印0到1号索引[Hash, Bob, Nick] [Hash, Bob, Nick] [Bob, Nick] [Hash, Bob]# 二维列表:一维列表中嵌套一维列表…

Module not found: Error: Can‘t resolve ‘core-js/modules/es.promise.js‘

1.遇到的问题 具体错误: ERROR in ./src/js/index.js 1:0-48 产环境配置15js兼容性处理srcjsERROR in ./src/js/index.js 2:0-39 Module not found: Error: Cant resolve core-js/modules/es.promise.js in D:DesktopMy FilesRecentlyStudyWebPackdemo3.webpack生…

R语言:因子分析 factor analysis

文章目录 因子分析数据集处理步骤主成分法做因子分析最大似然法做因子分析 因子分析 因子分析的用途与主成分分析类似,它也是一种降维方法。由于因子往往比主成分更易得到解释,故因子分析比主成分分析更容易成功,从而有更广泛的应用。 从方法…

华为OD 区间交集(200分)【java】A卷+B卷

华为OD统一考试A卷+B卷 新题库说明 你收到的链接上面会标注A卷还是B卷。目前大部分收到的都是B卷。 B卷对应20022部分考题以及新出的题目,A卷对应的是新出的题目。 我将持续更新最新题目 获取更多免费题目可前往夸克网盘下载,请点击以下链接进入: 我用夸克网盘分享了「华为O…

在 Python 中使用 Fsolve

本文将探讨如何使用 fsolve 在 Python 中求解。 我们还将探索它的使用场景和一些示例代码,以更好地理解如何以及何时使用它来达到某种结果。 让我们首先了解 fsolve 是什么以及为什么使用它。 Python 中的 fsolve 函数 方程是数据科学的根源,它们帮助数…

微前端二:qiankun

qiankun是基于Single-spa开发的框架,所以我们先来看下Single-spa是怎么做的: Single-spa 是最早的微前端框架,兼容多种前端技术栈,是一个将多个单页面应用聚合为一个整体应用的 JavaScript 微前端框架; 优点&#xf…

数据结构原理与分析知识点

知识点 在数据结构中,从逻辑上可以把数据结构分为线性结构和非线性结构算法分析:时间复杂性和空间复杂性算法---解决问题的有限运算序列栈的操作原则是后进先出在长度为n的顺序表的第 i(1≤i≤n 1)个位置上插入一个元素&#xff…

APP应用开发sdk版本过低可能性原因问题排查及解决方案

同学们,在移动 app 开发中,提示sdk版本过低缺找不到原因的情况都知道的吧哈哈哈,这个我觉得我有必要全面的分析和排查,让同学们看完这个文章都得以解决。这是我的初衷奈何地主家里也没有余粮呀(我也不能完全总结出来&a…

《动手学深度学习 Pytorch版》 8.7 通过时间反向传播

8.7.1 循环神经网络的梯度分析 本节主要探讨梯度相关问题,因此对模型及其表达式进行了简化,进行如下表示: h t f ( x t , h t − 1 , w h ) o t g ( h t , w o ) \begin{align} h_t&f(x_t,h_{t-1},w_h)\\ o_t&g(h_t,w_o) \end{ali…

用 Python 这样去创建词云不是更美嘛?

什么是词云?在网络上我们经常可以看到一张图片,上面有一大堆大小不一的文字,这便是词云。词云一般是根据输入的大量词语生成的,如果某个词语出现的次数越多,那么相应的大小就会越大。 Python 中有一个专门用来生成词云…

spring-cloud-starter-gateway踩坑

1.bean of type org.springframework.http.codec.ServerCodecConfigurer that could not be found. 需要将项目中用到的spring-boot-starter-web依赖给去掉 去掉以下的 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-bo…

智慧公厕:打造未来城市公共设施的智慧选择

随着信息技术的不断发展&#xff0c;城市公共设施需要实现个性化、高效化和智能化&#xff0c;其中包括公共厕所。智慧公厕是一种结合物联网、互联网、人工智能、云计算、大数据和传感感知等技术的新型公厕&#xff0c;旨在提高公共厕所管理效率、跨区域跨系统的联网管理、自动…

C# .Net6 指定WSDL, 生成Webservice,调用该接口服务

C# .Net6 指定WSDL, 调用该接口服务。 IDE&#xff1a; Microsoft Visual Studio Community 2022 (64 位)平台&#xff1a;.Net6协议&#xff1a;Soap协议 Xml格式 功能 需要开发一个前置机程序&#xff0c; 用于和硬件程序交互&#xff0c;已知条件是&#xff1a;嵌入式同事…

【C++入门 一 】学习C++背景、开启C++奇妙之旅

目录 1.什么是C2. C的发展史3. C的重要性3.1 语言的使用广泛度3.2 在工作领域1. 操作系统以及大型系统软件开发2. 服务器端开发3. 游戏开发4. 嵌入式和物联网领域5. 数字图像处理6. 人工智能7. 分布式应用 3.3 在校招领域3.3.1 岗位需求3.3.2 笔试题 4. 如何学习C4.1 别人怎么学…

WAL 模式(PostgreSQL 14 Internals翻译版)

性能 当服务器正常运行时&#xff0c;WAL文件不断被写入磁盘。但是&#xff0c;这些写操作是顺序的:几乎没有随机访问&#xff0c;因此即使是HDD也可以处理这个任务。由于这种类型的加载与典型的数据文件访问非常不同&#xff0c;因此有必要为WAL文件设置一个单独的物理存储&a…

数据结构之堆

目录 前言 堆的概念与结构 堆的实现 堆的初始化 堆的销毁 堆的显示 堆的插入 堆的向上调整算法 堆的删除 堆的向下调整算法 堆的判空 获取堆顶元素 堆的数据个数 堆的创建 前言 二叉树的顺序结构存储即使用数组存储&#xff0c;而数组存储适用于完全二叉树&#xf…

XSS攻击(2), XSS分类, 测试方法, 防御方法, 绕过方法

XSS攻击, XSS分类, 测试方法, 防御方法 对于所有类型的XSS渗透测试&#xff0c;确保您有适当的权限进行测试&#xff0c;以避免非法或不受欢迎的行为。 此外&#xff0c;渗透测试工具和框架&#xff0c;如Burp Suite或OWASP ZAP&#xff0c;可以帮助自动化一些测试任务并识别潜…