HarmonyOs学习 环境配置后 实验1:创建项目Hello World

HarmonyOS开发入门:环境配置与Hello World实验

实验目标

掌握HarmonyOS开发环境配置,创建首个HarmonyOS应用并实现"Hello World"界面展示

实验准备

  1. 已安装DevEco Studio开发环境
  2. 已配置HarmonyOS开发依赖项
  3. 熟悉基本TypeScript/ArkTS语法(推荐)

实验步骤

一、创建新项目

  1. 启动IDE
    打开DevEco Studio,进入欢迎页

  2. 选择项目模板
    File > New > New Project
    → 选择Application
    → 选择Empty Ability模板
    → 点击Next

  3. 工程配置

    配置项说明
    Project name自定义项目名称(如:HelloWorldDemo)
    Bundle name应用包名(格式:com.company.project,发布时需保持一致)
    Save location选择合适的工程存储路径
    Compile SDK选择API版本(推荐API 9)
    Model选择设备模型(Stage模型适合基础应用开发)
  4. 完成创建
    点击Finish,IDE将自动生成项目框架

二、项目结构解析

创建完成后,项目目录结构如下:

HelloWorldDemo/
├── entry/
│   ├── src/
│   │   └── main/
│   │       ├── pages/         # 页面组件
│   │       │   └── Index.ets  # 主页面源码
│   │       ├── resources/     # 资源文件
│   │       └── config.json    # 页面路由配置
├── build/                     # 编译输出目录
└── ...                        # 其他配置文件

三、Hello World实现

  1. 定位主页面
    打开entry/src/main/pages/Index.ets

  2. 代码分析

@Entry          // 标识页面入口组件
@Component      // 声明组件
struct Index {@State message: string = 'Hello World' // 响应式状态变量build() {     // 组件构建方法Row() {     // 行布局容器Column() { // 列布局容器Text(this.message) // 文本组件.fontSize(50)    // 设置字体大小.fontWeight(FontWeight.Bold) // 设置字体粗细}.width('100%') // 设置列宽占满父容器}.height('100%') // 设置行高占满父容器}
}
  1. 运行效果
    编译运行后将在设备中央显示加粗50px的"Hello World"文字

实验总结

  1. 环境配置要点

    • 确保Compile SDK版本与设备匹配
    • 包名命名需遵循反向域名规范
    • Stage模型支持基础应用开发
  2. 开发范式理解

    • 使用ArkTS声明式UI语法
    • 组件化开发思想(@Component)
    • 响应式状态管理(@State)
  3. 扩展建议
    尝试修改以下参数观察变化:

    • 调整fontSize数值
    • 修改message内容
    • 添加新的UI组件(如Button)

提示:可通过Previewer实时预览界面效果,提升开发效率。

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

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

相关文章

HTTP:十.cookie机制

Cookie概念及类型 HTTP cookie,简称cookie,又称数码存根、“网站/浏览+魔饼/魔片”等,是浏览网站时由网络服务器创建并由网页浏览器存放在用户计算机或其他设备的小文本文件。Cookie使Web服务器能在用户的设备存储状态信息(如添加到在线商店购物车中的商品)或跟踪用户…

记录小程序第一次调用Api,基于腾讯云Serverless函数,实现小程序的成功接入api,以及数据调用

目录 创建腾讯云个人账户新建severless应用建立函数URL小程序中调用api示例 创建腾讯云个人账户 百度搜索即可,并注册 新建severless应用 作者以github下载的某Api为例,这里不展示具体Api,只关注操作即可,相信都是互通的 在腾…

ES6 第一讲 变量定义 堆与栈 字符串的扩展和数值型的扩展

文章目录 1.ES6变量定义2.ES6堆和栈3.字符串的扩展3.1 模板字符串3.2 判断是否以指定的字符串开头或结尾3.3 字符串重复输出3.4 填充方法3.5 去除前后字符串空格3.6 返回参数指定位置的字符 4. 数值型的扩展4.1 二进制0B 八进制0O4.2 判断是否是一个无穷大的数字 (判…

LeetCode第158题_用Read4读取N个字符 II

LeetCode 第158题:用Read4读取N个字符 II 题目描述 给你一个文件,并且该文件只能通过给定的 read4 方法来读取,请实现一个方法来读取 n 个字符。 read4 方法: API read4 可以从文件中读取 4 个连续的字符,并且将它…

算法篇之单调栈

单调栈算法入门 单调栈是一种特殊的数据结构应用,它的核心在于维护一个栈,使得栈内元素保持单调递增或者单调递减的顺序。这种数据结构在解决很多算法问题时非常有效,例如求数组中每个元素的下一个更大元素、每日温度问题等。 一、单调栈的…

Kubernetes控制平面组件:调度器Scheduler(二)

云原生学习路线导航页(持续更新中) kubernetes学习系列快捷链接 Kubernetes架构原则和对象设计(一)Kubernetes架构原则和对象设计(二)Kubernetes架构原则和对象设计(三)Kubernetes控…

【网络】数据链路层知识梳理

全是通俗易懂的讲解,如果你本节之前的知识都掌握清楚,那就速速来看我的笔记吧~ 自己写自己的八股!让未来的自己看懂! (全文手敲,受益良多) 数据链路层 我们来重新理解一下这个图:…

机器学习(神经网络基础篇)——个人理解篇6(概念+代码)

1 在声明一个类中,构建一个属于类的函数,前面为什要加上“self”? 就像下面这一串代码: class TwoLayerNet:def __init__(self, input_size, hidden_size, output_size,weight_init_std0.01):# 初始化权重self.params {}self.p…

Cribl 对Windows-xml log 进行 -Removing filed-06

Removing Fields Description​ The Eval Function can be used to add or remove fields. In this example we will remove the extracted fields while preserving _raw, _time,index,source, sourcetype. Steps - Adding an Eval Function

chili3d调试6 添加左侧面板

注释前 一个一个注释看对应哪个窗口 无事发生 子方法不是显示的窗口 注释掉看看 没了 注释这个看看 零件页面没了 这个浏览器居然完全不用关的,刷新就重载了 注释看看 无工具栏版本 sidebar: 往框框里面加入 div({ className: style.input }, user_…

Linux学习——了解和熟悉Linux系统的远程终端登录

Linux学习——了解和熟悉Linux系统的远程终端登录 一.配置Ubuntu系统的网络和用户 1、设置虚拟机网络为桥接模式 打开VMWare,选择编辑虚拟机设置,在网络适配器设置中,选择“桥接模式”,保存设置并启动Ubuntu。 2、配置Ubuntu的…

【JAVA EE初阶】多线程(1)

这样的代码,虽然也能打印hello thread,但是没有创建新的线程,而是直接在main方法所在的主线程中执行了run的逻辑 start方法,是调用系统api,真正在操作系统内部创建一个线程。这个新的线程会以run作为入口方法&#xff…

javase 学习

一、Java 三大版本 javaSE 标准版 (桌面程序; 控制台开发) javaME 嵌入式开发(手机、小家电)基本不用,已经淘汰了 javaEE E业级发开(web端、 服务器开发) 二、Jdk ,jre jvm 三…

【Linux】Linux 操作系统 - 05 , 软件包管理器和 vim 编辑器的使用 !

文章目录 前言一、软件包管理器1 . 软件安装2 . 包管理器3 . Linux 生态 二、软件安装 、卸载三、vim 的使用1 . 什么是 vim ?2 . vim 多模式3 . 命令模式 - 命令4 . 底行模式 - 命令5. 插入模式6 . 替换模式7 . V-BLOCK 模式8 . 技巧补充 总结 前言 本篇笔者将会对软件包管理…

python基础知识点(1)

python语句 一行写一条语句 一行内写多行语句,使用分号分隔建议每行写一句,且结束时不写分号写在[ ]、{ }内的跨行语句,被视为一行语句\ 是续行符,实现分行书写功能 反斜杠表示下一行和本行是同一行 代码块与缩进 代码块复合语句&#xf…

C#/.NET/.NET Core技术前沿周刊 | 第 35 期(2025年4.14-4.20)

前言 C#/.NET/.NET Core技术前沿周刊,你的每周技术指南针!记录、追踪C#/.NET/.NET Core领域、生态的每周最新、最实用、最有价值的技术文章、社区动态、优质项目和学习资源等。让你时刻站在技术前沿,助力技术成长与视野拓宽。 欢迎投稿、推荐…

HTML表单与数据验证设计

HTML 表单与数据验证设计:构建可靠的用户数据采集系统 引言 互联网的核心是数据交互,而HTML表单是这一交互的主要入口。作为前端工程师,设计高质量的表单不仅关乎用户体验,更直接影响数据收集的准确性和系统安全。 在我的学习实…

基于STM32的Keil环境搭建与点灯

本人使用的STM32开发板为正点原子的STM32F103ZE,在此记录完整的搭建与点灯过程。 一、Keil的安装与配置 安装Keil 首先进入Keil下载官网:https://www.keil.com/download/product/ 点击MDK-ARM,并填写相关信息,之后开始下载最新版…

React-useRef

如果我们想在hooks里面获同步取最新的值&#xff0c;那么则可以使用useRef, 关键源码如下&#xff1a; function mountRef<T>(initialValue: T): {|current: T|} {const hook mountWorkInProgressHook();const ref {current: initialValue};hook.memoizedState ref;re…

幽灵依赖与常见依赖管理

文章目录 前言1. 演示&#xff1a;检测和修复幽灵依赖步骤1&#xff1a;安装 depcheck步骤2&#xff1a;在项目根目录运行 depcheck可能的输出步骤3&#xff1a;修复幽灵依赖 2. 依赖管理的好习惯 1. 场景设定现在有如下依赖需求&#xff1a; 2. 依赖冲突的表现3. 解决依赖冲突…