鸿蒙开发HarmonyOS NEXT (一) 入门

最近总听见大家讨论鸿蒙,前端转型的好方向?先入门学习下

目前官方版本和文档持续更新中

一、开发环境

提示:要占用的空间比较多,建议安装在剩余空间多的盘

1、下载:官网最新工具 - 下载中心 - 华为开发者联盟 (huawei.com)下载安装即可

2、安装node和sdk(补充:我下载的是2024/6/21发布的5.0.3版本,应该是默认配好了,无需步骤2)

安装好后,新建第一个程序试试看(跟微信开发者工具一样,会默认创建项目结构)

二、ArkTs入门

可参考官网案例初识ArkTS语言 | 华为开发者联盟 (huawei.com)

就是ts变化而来的,写了个小案例检验了一下,ts语法基本都是可用的

三、ArkUI组件

ArkUI(方舟UI框架)-应用框架 | 华为开发者联盟 (huawei.com)

随用随查,非常方便

写个小案例,【通过输入或者点击按钮改变图片大小】


@Entry //装饰器-入口,可以直接作为页面显示
@Component //装饰器-组件
struct Index { //自定义组件@State normalWidth: number = 250; //变量-监控build() {// UI描述,内部声明式UI结构Row() {Column(){Image($r('app.media.head')).width(this.normalWidth).interpolation(ImageInterpolation.High)Flex({ direction: FlexDirection.Row }) {Text('调节大小:').width(100).textAlign(TextAlign.Start).padding(10)TextInput({text:String(this.normalWidth)}).width(180).type(InputType.Number).onChange((value) => {this.normalWidth = parseInt(value)})}.height(70).width('90%').padding(10)Flex({ direction: FlexDirection.Row }) {Button('变大', { type: ButtonType.Normal, stateEffect: true }).borderRadius(4).backgroundColor(0x317aff).width(90).height(40).margin(10).onClick(()=>{if(this.normalWidth < 300){this.normalWidth += 10}})Button('变小', { type: ButtonType.Normal, stateEffect: true }).borderRadius(4).backgroundColor(0xF55A42).width(90).height(40).margin(10).onClick(()=>{if(this.normalWidth >= 100){this.normalWidth -= 10}})}.height(70).width('90%').padding(10)Slider({min:0,max:400,step:10,value:this.normalWidth,style:SliderStyle.OutSet,direction:Axis.Horizontal,reverse:false,}).width('90%').blockColor('#36d').showTips(true).onChange(value=>{this.normalWidth = value})}.width('100%')}.height('100%').width('100%')}
}

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

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

相关文章

放烟花短视频素材去哪里找?去哪里下载?烟花素材网分享

在当代社会&#xff0c;短视频凭借其独有的魅力成为大众传递情感、记录生活、分享快乐的新兴方式。特别是在庆祝节日和特殊时刻时&#xff0c;烟花的绚丽效果常常被用来吸引观众的目光&#xff0c;成为视频作品中的亮点。然而&#xff0c;对于短视频制作者来说&#xff0c;寻找…

初探 YOLOv8(训练参数解析)

文章目录 1、前言2、Backbone网络3、YOLOv8模型训练代码3.1、模型大小选择3.2、训练参数设置 4、训练参数说明5、目标检测系列文章 1、前言 YOLO 因为性能强大、消耗算力较少&#xff0c;一直以来都是实时目标检测领域的主要范式。该框架被广泛用于各种实际应用&#xff0c;包…

探索音频创作的无限可能——Studio One 5 软件深度解析

Studio One 5 是一款功能强大且备受赞誉的音频制作软件&#xff0c;无论是专业音乐制作人还是业余爱好者&#xff0c;都能在其中找到满足自己需求的强大功能。 对于 Mac 和 Windows 用户来说&#xff0c;Studio One 5 提供了一个直观且友好的操作界面。其简洁明了的布局让用户…

Windows的内核对象

内核对象句柄特定于进程。 也就是说,进程必须创建 对象或打开现有对象以获取内核对象句柄。 内核句柄上的每个进程限制为 2^24。 但是,句柄存储在分页池中,因此可以创建的实际句柄数取决于可用内存。 可以在 32 位 Windows 上创建的句柄数明显低于 2^24。 任何进程都可以为…

Haproxy负载均衡集群

一、HAProxy介绍 HAProxy是法国开发者威利塔罗(Willy Tarreau)在2000年使用C语言开发的一个开源软件&#xff0c;是一款具备高并发(一万以上)、高性能的TCP和HTTP负载均衡器&#xff0c;支持基于cookie的持久性&#xff0c;自动故障切换&#xff0c;支持正则表达式及web状态统…

【Python】易错题 [1]

目录 一、选择&#xff1a; 1.列表的复制​编辑 2.函数 二、填空 一、选择&#xff1a; 1.列表的复制 在Python中&#xff0c;列表是可变的数据类型。当将一个列表赋值给另一个变量时&#xff0c;实际上是将这个变量的引用指向原始列表。&#xff08;指针&#xff09;因此&…

【FFmpeg】avformat_alloc_output_context2函数

【FFmpeg】avformat_alloc_output_context2函数 1.avformat_alloc_output_context21.1 初始化AVFormatContext&#xff08;avformat_alloc_context&#xff09;1.2 格式猜测&#xff08;av_guess_format&#xff09;1.2.1 遍历可用的fmt&#xff08;av_muxer_iterate&#xff0…

TEMU全/半托管订单如何避免错发/漏发?用妙手ERP扫描发货功能!

这两年&#xff0c;因为全托管/半托管模式的火爆&#xff0c;跨境卖家纷纷加入全托管和半托管&#xff0c;许多卖家在加入后&#xff0c;店铺频频爆单。 以为是泼天富贵&#xff0c;没想到却因为发货问题亏麻了&#xff1a;发货效率低&#xff0c;导致超过平台发货时效&#x…

第30课 绘制原理图——放置网络标签

什么是网络标签&#xff1f; 我们在很多电路图中都能看到&#xff0c;为了让图纸更加简洁&#xff0c;并不是每一根导线都要确确实实地画出来。可以在导线悬空的一端添加一个名称标签&#xff0c;接着在另一根导线的悬空一端添加上一个同名的名称标签&#xff0c;那么就可以让…

Qt 基于FFmpeg的视频播放器 - 播放、暂停以及拖动滑动条跳转

Qt 基于FFmpeg的视频转换器 - 播放、暂停以及拖动进度条跳转 引言一、设计思路二、核心源码以及相关参考链接 引言 本文基于FFmpeg&#xff0c;使用Qt制作了一个极简的视频播放器. 相比之前的版本&#xff0c;加入了播放、暂停、拖动滑动条跳转功能&#xff0c;如上所示 (左图)…

SpringSecutrity原理

一、基于RBAC实现的权限管理通常需要涉及以下几张表&#xff1a; 1. 用户表&#xff08;user&#xff09;&#xff1a;记录系统中的所有用户&#xff0c;包括用户ID、用户名、密码等信息。 2. 角色表&#xff08;role&#xff09;&#xff1a;记录系统中的所有角色&#xff0…

基于51单片机太阳能风能风光互补路灯控制器

一.硬件方案 本设计由STC89C52单片机电路太阳能电池板电路风机发电电路锂电池充电保护电路升压电路稳压电路光敏电阻电路4位高亮LED灯电路2档拨动开关电路电源电路设计而成。 二.设计功能 &#xff08;1&#xff09;采用风机和太阳能电池板给锂电池充电&#xff0c;具有充电…

系统架构设计师 - 数据库系统(2)

数据库系统 数据库系统规范化理论 ★ ★ ★ ★ ★函数依赖求候选键Armstrong公理范式判断第一范式 1NF第二范式 2NF第三范式 3NFBC 范式 BCNF 模式分解保持函数依赖分解无损分解 并发控制 ★事务的 ACID 特性并发存在的问题并发解决方案 - 封锁协议 数据库的安全性 ★安全性的分…

十三、Maven(1)

&#x1f33b;&#x1f33b;目录 一、maven价绍二、maven的功能1、项目自动化构建2、管理jar、war包3、实现项目结构设计 三、maven安装1、maven的安装环境需要jdk2、Maven的安装路径中不能出现中文和空格3、压缩包解压即可4、配置环境变量 四、maven的仓库1. Maven仓库配置2. …

选型手册:Bosch Sensortec 博世 微机电系统(MEMS)传感器和方案

前言 博世传感器公司&#xff08;Bosch Sensortec&#xff09; 是全球领先的微机电系统&#xff08;MEMS&#xff09;传感器和解决方案供应商。公司成立于2005年&#xff0c;是德国罗伯特博世有限公司&#xff08;Robert Bosch GmbH&#xff09;旗下的全资子公司。博世传感器公…

SpringBoot【3】集成 Swagger

SpringBoot 集成 Swagger 前言pom.xml 配置文件application.yml 配置文件config 包Swagger2Config entity 包UserEntity service 包impl 包SwaggerServiceImpl SwaggerService controller 包SwaggerController SwaggerApplication验证 前言 创建项目步骤、及版本选择等&#x…

展开说说:Android列表之RecyclerView

RecyclerView 它是从Android5.0出现的全新列表组件&#xff0c;更加强大和灵活。用于显示列表形式 (list) 或者网格形式 (grid) 的数据&#xff0c;替代ListView和GridView成为Android主流的列表组件。可以说Android客户端只要有表格的地方就有RecyclerView。 RecyclerView 内…

VCS编译bug汇总

‘typedef’ is not expected to be used in this contex 注册前少了分号。 Scope resolution error resolution : 声明指针时 不能与类名同名&#xff0c;即 不能声明为adapter. cannot find member "type_id" 忘记注册了 拼接运算符使用 关键要加上1b&#xff0…

[MySQL]购物管理系统—简略版

本文内容需以MySQL支持 特别感谢baidu comate AI提供的少量虚拟数据 0.建库(建立数据库——utf8字符集&#xff0c;utf8_general_ci排序规则) 1.此项目ER图如下 2.DDLDML(共九表&#xff0c;27数据) SET FOREIGN_KEY_CHECKS 0;DROP TABLE IF EXISTS goods; CREATE TABLE g…

前端vue-cli相关知识与搭建过程(项目创建,组件路由)very 详细

一.关于vue-cli 1.什么是vue Vue (读音 /vju ː /&#xff0c;类似于 view) 是一套用于构建用户界面的渐进式框架。Vue 的核心库只关注视图层&#xff0c;不仅易于上手&#xff0c;还便于与第三方库或既有项目整合。 Vue.js 是前端的主流框架之一&#xff0c;和 Angular.js…