HarmonyOS实战—布局和组件的概述

简介: HarmonyOS实战—布局和组件的概述

组件的概述

  • 屏幕展示出来的元素,都称之为组件。比如华为已经提供的:文本,图片,进度条,输入框等。
  • 注意点:组件在未被添加到布局中时,既无法显示也无法交互,因此一个用户界面至少包含一个布局。
  • 如下分别有:按钮组件、图片组件、文本组件、文本输入框组件、进度条组件、滑块组件、多选框组件、单选框组件。

在这里插入图片描述

  • 鸿蒙中会把组件分为两大类:显示类组件交互类组件

在这里插入图片描述

  • 这么多组件有个共同的父类:Component,方法就是返回一个 component 对象,就表示返回一个组件的对象。

在这里插入图片描述

  • 其实之前所说的布局也是一种组件,可以把布局理解为容器类的组件,专门用来装其他类的组件的。

在这里插入图片描述

布局的概述

  • 组件的展示方式。比如:线性布局,相对布局,绝对布局,格子布局等。
  • 顶级父类:ComponentContainer。理解为组件容器。
  • 布局一般以“Layout”结尾,如DirectionalLayoutDependentLayout等。不同的布局中,组件的展示方式是不一样的,比如线性布局,就是从上往下,或者从左往右依次摆放内部组件的。比如格子布局,就是n行n列的格子。
  • 注意点:组件在未被添加到布局中时,既无法显示也无法交互,因此一个用户界面至少包含一个布局。

1. 显示类组件

  • 显示类组件:只负责数据展示的,无法跟用户交互,比如展示文本的组件,展示图片的组件。

2. 交互类组件

  • 交互类组件:可以跟用户交互的,比如用户可以点击的按钮组件,用户可以输入的文本框组件。

3. 布局类组件

  • 布局其实也是一种比较特殊的组件。
目录
相关文章
|
4天前
|
JavaScript API 数据处理
基于HarmonyOS 5.0 (Next)技术的渐变模糊效果技术实现【代码实战】
本文详细介绍如何在HarmonyOS 5.0(Next)中实现渐变模糊效果,涵盖从基础页面搭建到添加模糊、渐变效果的全过程,并通过代码实战展示具体操作步骤。文章首先介绍了使用`Stack`和`Image`控件设置背景并应用`foregroundBlurStyle`属性实现模糊效果,接着通过`linearGradient`属性融入渐变效果,使界面更加精致美观。此外,还展示了如何利用滑动条和手势等交互元素动态调整模糊与渐变效果,增强用户体验。最后,通过具体代码示例说明如何为图片、弹窗等控件添加渐变模糊效果,突显HarmonyOS的强大功能与灵活性。
31 17
|
5天前
|
数据管理 API 调度
鸿蒙HarmonyOS应用开发 | 探索 HarmonyOS Next-从开发到实战掌握 HarmonyOS Next 的分布式能力
HarmonyOS Next 是华为新一代操作系统,专注于分布式技术的深度应用与生态融合。本文通过技术特点、应用场景及实战案例,全面解析其核心技术架构与开发流程。重点介绍分布式软总线2.0、数据管理、任务调度等升级特性,并提供基于 ArkTS 的原生开发支持。通过开发跨设备协同音乐播放应用,展示分布式能力的实际应用,涵盖项目配置、主界面设计、分布式服务实现及部署调试步骤。此外,深入分析分布式数据同步原理、任务调度优化及常见问题解决方案,帮助开发者掌握 HarmonyOS Next 的核心技术和实战技巧。
121 76
鸿蒙HarmonyOS应用开发 | 探索 HarmonyOS Next-从开发到实战掌握 HarmonyOS Next 的分布式能力
|
18天前
|
UED
「Mac畅玩鸿蒙与硬件40」UI互动应用篇17 - 照片墙布局
本篇将带你实现一个简单的照片墙布局应用,通过展示多张图片组成照片墙效果,用户可以点击图片查看其状态变化。
131 67
|
6天前
「Mac畅玩鸿蒙与硬件46」UI互动应用篇23 - 自定义天气预报组件
本篇将带你实现一个自定义天气预报组件。用户可以通过选择不同城市来获取相应的天气信息,页面会显示当前城市的天气图标、温度及天气描述。这一功能适合用于动态展示天气信息的小型应用。
96 38
|
5天前
|
开发框架 人工智能 安全
鸿蒙HarmonyOS应用开发 | 「鸿蒙技术分享」HarmonyOS NEXT元服务卡片实战体验
HarmonyOS NEXT的发布对华为及整个行业都产生了深远的影响。它不仅展示了华为的技术实力,还敏锐地把握了市场需求。同时,吸引了更多的开发者和合作伙伴加入鸿蒙生态体系,共同推动鸿蒙生态的繁荣发展。
176 20
鸿蒙HarmonyOS应用开发 | 「鸿蒙技术分享」HarmonyOS NEXT元服务卡片实战体验
|
4天前
|
缓存 API 开发者
基于HarmonyOS 5.0 (Next)的一种面向多设备跨平台的高性能自适应布局能力研究和实现
随着万物互联时代的到来,操作系统作为连接设备、应用与用户体验的核心愈发重要。华为发布的HarmonyOS 5.0(Next)是一款完全自主的手机操作系统,实现了全栈自研,在技术架构和生态体验上进行了颠覆性升级。本文聚焦于基于HarmonyOS 5.0(Next)实现多设备跨平台的高性能自适应布局能力,通过深入分析其技术特点和生态优势,结合开发实践探讨如何利用自适应布局和响应式布局技术,确保应用在多种设备上提供一致且优质的用户体验。研究将基于HarmonyOS 5.0(Next)的分布式能力和ArkTS编程语言,展示多设备跨平台环境下实现高性能自适应布局的方法,推动鸿蒙生态的发展。
40 16
基于HarmonyOS 5.0 (Next)的一种面向多设备跨平台的高性能自适应布局能力研究和实现
|
4天前
|
安全 数据安全/隐私保护 UED
HarmonyOS 5.0 (Next)应用开发实战:使用ArkTS构建开箱即用的登录页面【HarmonyOS 5.0(Next)】
### HarmonyOS 5.0(Next)应用开发实战:使用ArkTS构建开箱即用的登录页面 HarmonyOS 5.0(Next)融合了美学与科技,引入“光感美学”设计理念和多设备深度协同功能。本文通过 ArkTS 构建一个简单的登录页面,展示了模块化导入、状态管理、方法封装、声明式UI构建及事件处理等最佳实践。代码实现了一个包含用户名和密码输入框及登录按钮的界面,支持错误提示和页面跳转。
42 14
HarmonyOS 5.0 (Next)应用开发实战:使用ArkTS构建开箱即用的登录页面【HarmonyOS 5.0(Next)】
|
5天前
|
物联网 调度 vr&ar
鸿蒙HarmonyOS应用开发 |鸿蒙技术分享HarmonyOS Next 深度解析:分布式能力与跨设备协作实战
鸿蒙技术分享:HarmonyOS Next 深度解析 随着万物互联时代的到来,华为发布的 HarmonyOS Next 在技术架构和生态体验上实现了重大升级。本文从技术架构、生态优势和开发实践三方面深入探讨其特点,并通过跨设备笔记应用实战案例,展示其强大的分布式能力和多设备协作功能。核心亮点包括新一代微内核架构、统一开发语言 ArkTS 和多模态交互支持。开发者可借助 DevEco Studio 4.0 快速上手,体验高效、灵活的开发过程。 239个字符
150 13
鸿蒙HarmonyOS应用开发 |鸿蒙技术分享HarmonyOS Next 深度解析:分布式能力与跨设备协作实战
|
4天前
|
自然语言处理 搜索推荐 数据安全/隐私保护
鸿蒙登录页面好看的样式设计-HarmonyOS应用开发实战与ArkTS代码解析【HarmonyOS 5.0(Next)】
鸿蒙登录页面设计展示了 HarmonyOS 5.0(Next)的未来美学理念,结合科技与艺术,为用户带来视觉盛宴。该页面使用 ArkTS 开发,支持个性化定制和无缝智能设备连接。代码解析涵盖了声明式 UI、状态管理、事件处理及路由导航等关键概念,帮助开发者快速上手 HarmonyOS 应用开发。通过这段代码,开发者可以了解如何构建交互式界面并实现跨设备协同工作,推动智能生态的发展。
38 10
鸿蒙登录页面好看的样式设计-HarmonyOS应用开发实战与ArkTS代码解析【HarmonyOS 5.0(Next)】
|
3天前
|
JavaScript Java 容器
鸿蒙应用开发从入门到入行 - 篇4:层叠布局、自定义组件、ForEach
导读:在本篇文章里,您将掌握层叠布局、自定义组件的用法,特别是自定义组件将来的开发中必然会用,其中应该特别关注自定义组件的一些规范与装饰器。
26 7
鸿蒙应用开发从入门到入行 - 篇4:层叠布局、自定义组件、ForEach

热门文章

最新文章