HarmonyOS Developer使用指南-示例教程

丶龙八夷

发布于 2023-4-4 14:22

浏览

0收藏

示例代码

目录名	名称	简介	主要编程语言
ability	自定义通知（JS）	本示例演示了如何自定义通知样式，以及通过编辑框回复自定义内容。	JS
ETSUI	图案密码锁组件（ArkTS）	基于HarmonyOS的图案密码锁组件，以宫格图案的方式输入密码，用于密码验证。	ArkTS
	创建简单视图（ArkTS）	本示例为构建了简单页面展示食物番茄的图片和营养信息，主要为了展示简单页面的Stack布局和Flex布局。	ArkTS
	页面布局和连接（ArkTS）	本示例构建了食物分类列表页面和食物详情页，向开发者展示了List布局、Grid布局以及页面路由的基本用法。	ArkTS
	绘图和动画（ArkTS）	本示例构建了健康饮食应用的闪屏动画，向开发者展示了绘制组件和显式动画的基本用法。	ArkTS
network	WebSocket（ArkTS）	基于HarmonyO的WebSocket的使用，包括客户端与服务端的连接和断开以及客户端数据的接收和发送。	ArkTS
JSUI	基本动画（JS）	本示例演示了JS FA中图片组件常见的几种动画效果，例如：缩放、旋转、平移、渐变等。	JS
	多设备自适应的效率型首页	本示例展示了一个列表页面，在不同尺寸的设备上，通过拉伸、缩放、均分、占比等自适应能力，使用多态控件、布局和组件的延展性以及响应式布局的运用，自适应展示为合理的布局效果。	JS
	多设备自适应的FA页面	本示例构建了常见应用的信息展示页面，包含搜索栏，列表展示。在不同尺寸的设备上，通过拉伸、缩放、隐藏、均分、占比等自适应能力，使用多态控件、布局和组件的延展性以及响应式布局的运用，自适应展示为合理的布局效果。	JS
	多设备自适应服务卡片	本示例分别通过沉浸式卡片、图文卡片、宫格卡片、纯文本卡片、多维度信息卡片五种类型，展示了卡片在不同尺寸设备上的自适应能力。当卡片在极宽和极高的情况下，通过拉伸、缩放、隐藏、折行、均分等自适应能力将卡片展示出来。	JS
	动效示例应用	本示例演示了组件动效的基础能力，包含组件的旋转、平移、显隐切换，以及组件阴影等，其中动效负载可调节。	JS
	JsApp	本示例演示了如何开发一个JS FA。	JS
	JsComponents	本示例演示了如何使用JS基础组件开发一个应用界面。	JS
	JS 卡片开发	本示例展示了服务卡片功能，通过服务卡片将用户应用程序的重要信息展示在桌面，用户可通过快捷手势使用卡片，以达到服务直达、减少层级跳转的目的。	JS
	图库示例应用	本示例为一个仿图库的JS应用，模拟多图片场景，开发者可自行添加或者更换图片资源，构建自己的多图场景。	JS
	购物示例应用	本示例为一个仿购物类的JS应用，使用了混合的布局，包含图片、视频、文本等资源。	JS
	JS启动模态配置	本示例演示了方舟开发框架提供的半模态和弹窗模态的启动方式。	JS
	用户注册（JS）	本示例以用户注册为例，演示JS FA基本控件的使用，包含文本输入框、日期选择控件、单选按钮、下拉菜单和普通按钮等。	JS
data	轻量级偏好数据库	本示例通过 Preferences 创建、删除、更新和查询应用程序偏好数据，主要实现了登录页面偏好数据存取及主页面背景色偏好数据存取。	JS
native	JSNativeDemo	本示例使用JS和C++开发，使用JS调用C++代码，并在UI上显示C++代码运行结果。	JS、C++
	Native_layer	本示例展示了关于Native_layer的JNI接口的使用，使应用程序能够获取与Java表面对象匹配的原生层，可以获取原生层信息，也可以设置原生层大小和图层格。	C++
	Native_image	本示例展示了如何声明JNI接口并通过JNI接口锁定和访问或解锁像素数据的函数。	C++

Codelabs

为了方便开发者针对重点功能或场景进行开发，本页面对当前有的Codelabs资源进行了汇总，如下表所示：

分类	主题	简介
Ability框架	UIAbility内页面间的跳转（ArkTS）	基于Stage模型下的Ability开发，实现Ability内页面间的跳转。
	Stage模型下Ability的创建和使用（ArkTS）	本篇Codelab基于Stage模型，以购物应用为例，讲解Ability的创建和使用。
	常见页面跳转（JS）	基于HarmonyOS方舟开发框架（ArkUI），介绍并实现常见的页面跳转，包括JS Page之间的跳转、Ability之间的跳转、通过Action的方式实现的跳转。
效率提升套件	常见组件和容器低代码开发示例（ArkTS）	基于ArkTS语言的低代码开发方式，利用常用组件实现任务列表和任务信息的页面展示。
效率提升套件	FA调用PA开发效率提升插件（JS）	基于HarmonyOS JS UI的FA调用PA机制，使用js2java-codegen工具自动生成模板代码，提升开发效率。
分布式	分布式手写板（JS）	基于兼容JS的的类Web开发范式，使用分布式能力，实现多设备同步书写互动。
	分布式鉴权（JS）	基于FeatureAbility分布式拉起FA机制，实现鉴权功能。
	分布式新闻客户端（JS）	基于兼容JS的类Web开发范式，使用HarmonyOS应用中Service Ability和Page Ability，实现跨设备FA拉起。
	分布式新闻客户端（ArkTS）	基于HarmonyOS ArkUI，使用HarmonyOS应用中Service Ability和Page Ability，实现跨设备FA拉起。
UI（JS）	image、image-animator（JS）	基于兼容JS的类Web开发范式，使用Image、image-animator，实现图片展示与界面交互的动态效果。
	input、label（JS）	基于兼容JS的类Web开发范式，使用input组件，实现form表单的输入以及表单验证效果。
	rating（JS）	基于兼容JS的类Web开发范式，使用rating组件，实现星级打分的效果。
	slider（JS）	基于兼容JS的类Web开发范式，使用slider组件，实现可调节风车大小和转速的动画效果。
	switch、chart（JS）	基于兼容JS的类Web开发范式，使用switch、chart组件，实现可以切换数据动静的展示效果。
	toolbar、toolbar-item（JS）	基于兼容JS的类Web开发范式，使用toolbar、toolbar-item组件，实现面板切换的效果。
	video（JS）	基于兼容JS的类Web开发范式，使用video组件，实现视频的播放、暂停、进度拖拽、全屏效果。
	dialog（JS）	基于兼容JS的类Web开发范式，使用dialog组件实现几种常用的弹窗效果。
	动画样式（JS）	基于兼容JS的类Web开发范式，使用动画样式实现平移、旋转、缩放以及透明度变化的效果。
UI（ArkTS）	ArkTS基础知识（ArkTS）	本篇Codelab使用渲染控制语法和组件化基础知识，搭建一个可刷新的排行榜页面。
	新闻数据加载（ArkTS）	基于HTTP网络请求加载新闻数据，提供下拉刷新和上拉加载功能。
	转场动画的使用（ArkTS）	基于ArkTS的声明式开发范式及HarmonyOS系统的转场动画接口，实现一系列页面动画切换的场景。
	动效示例（ArkTS）	如何利用ArkTS为组件的属性添加过渡的动态效果，提升用户体验。
	自定义下拉刷新动画（ArkTS）	基于ArkTS的声明式开发范式，使用HarmonyOS属性动画实现自定义下拉刷新动画组件的示例。
	ArkUI常用布局容器对齐方式（ArkTS）	基于HarmonyOS ArkUI，实现Flex、Column、Row和Stack这四种布局容器对齐方式的设置。
	应用内字体大小调节（ArkTS）	基于Slider组件和首选项，实现通过拖动滑块调节应用内字体大小的功能。
	常用组件与布局（ArkTS）	基于ArkTS扩展的声明式开发范式，使用常用组件与布局实现一个购物社交应用示例。
	基础组件Slider的使用（ArkTS）	使用Slider组件，实现了可调节风车大小和转速的动画效果。
	List组件的用法之设置项（ArkTS）	基于ArkTS，使用List组件以及路由能力，实现一个设置列表，点击对应的设置项可以跳转到详细的设置页。
	List组件的用法之商品列表（ArkTS）	基于ArkTS，使用List组件，实现了商品列表的懒加载、下拉刷新与列表触底提示并回弹的效果。
	一次开发多端部署（ArkTS）	使用ArkTS实现“一次开发，多端部署”的UI开发。
	健康生活（ArkTS）	利用ArkTS声明式开发范式和HarmonyOS的关系型数据库等能力，实现了一个健康生活应用。
	Web组件抽奖案例（ArkTS）	基于Web组件加载本地和在线H5小程序，实现ArkTS和H5交互功能。
	应用首次启动（ArkTS）	本篇Codelab将介绍基于HarmonyOS ArkUI，实现了一个模拟应用首次启动的案例。
	极简声明式UI范式（ArkTS）	基于HarmonyOS极简声明式UI范式开发，实现一个简单的图库应用。
	购物应用（ArkTS）	基于HarmonyOS UI丰富的组件实现购物商城应用。
	Web组件的使用（ArkTS）	使用ArkTS语言，Web组件对cookie的读写操作。
	Swiper使用（ArkTS）	使用ArkTS语言，基于Swiper容器组件，实现几种常见的应用场景。例如顶部导航、广告轮播图等场景。
	流式布局（ArkTS）	基于Flex容器特性，实现流式布局效果。
	二级联动（ArkTS）	基于HarmonyOS ArkUI，实现一个导航与内容二级联动的效果。
	Native XComponent（ArkTS）	基于HarmonyOS ArkUI，使用XComponent组件调用Native API，实现图形渲染。
	简易Native C++ 示例（ArkTS）	基于HarmonyOS ArkUI，采用“Native C++”模板，实现了通过Node-API调用C标准库的功能。
	像素转换（ArkTS）	基于HarmonyOS ArkUI，展示了像素单位与像素转换的使用方式。
卡片	电影卡片（JS）	基于服务卡片，实现了一个JS电影卡片应用，介绍了卡片的action的使用和卡片的相关回调。
卡片	计步器卡片（JS）	基于兼容JS的类Web开发范式，实现桌面卡片数据的可视化。
媒体	图片编辑模板（JS）	基于canvas组件，实现图片绘制、裁剪、缩放、保存和恢复。
	简易视频播放器（JS）	基于兼容JS的类Web开发范式，实现一个简单视频播放器，可支持海报轮播、视频播放等功能。
	简易视频播放器（ArkTS）	基于ArkUI框架，实现一个简单视频播放器，可支持海报轮播、视频播放等功能。
数据库	关系型数据库（ArkTS）	本Codelab介绍了关系型数据库的基本用法，包括增、删、改、查操作。
数据库	首选项（ArkTS）	基于首选项，实现对本地应用数据的访问及操作。
通用组件	组件购物应用演示（JS）	使用JS实现一款简单的HarmonyOS购物应用。
三方库	库的调用（ArkTS）	基于ArkTS语言实现对社区库和本地库的调用及使用。
公共事件与通知	HarmonyOS后台代理提醒（ArkTS）	基于HarmonyOS ArkTS的后台代理提醒系统接口，实现添加后台代理提醒功能。
公共事件与通知	闹钟（ArkTS）	基于HarmonyOS ArkUI的后台代理提醒接口，实现一个简单的闹钟示例。

视频教程

为了方便开发者更好地学习HarmonyOS相关知识，本页面对当前有的视频教程资源进行了汇总，如下表所示：

主题	简介
<HarmonyOS第一课>运行Hello World	开启学习之旅，安装DevEco Studio开发工具，运行第一个应用。
<HarmonyOS第一课>应用程序框架	从应用入口开始，了解用户如何与应用交互，理解应用的生命周期。
<HarmonyOS第一课>ArkTS基础知识	掌握基于TS扩展的ArkTS语言，以更接近自然语义快速开发应用。
<HarmonyOS第一课>构建漂亮的页面	为应用选择合适的组件，构建漂亮的页面。
<HarmonyOS第一课>从网络获取数据	学习如何访问网络，来构建一个可以从网络实时获取数据的应用。
<HarmonyOS第一课>保存应用数据	存储应用的一些常用配置，以便应用获得更快的数据存取速度。
<HarmonyOS主题课>ArkUI之属性动画	声明式UI框架，它使用极简的UI信息语法、丰富的UI动效组件和API、以及实时界面预览工具，帮助提升应用界面开发的效率。
<HarmonyOS主题课>三方库	包含UI、动画、图片、多媒体、文件数据、网络、安全、工具等类型的三方库，帮助快速开发应用。

文章转载自：https://developer.harmonyos.com/cn/docs/documentation/doc-guides-V3/video-tutorials-0000001443535745-V3

分类

标签

已于2023-4-4 14:22:31修改

51CTO

51CTO博客

51CTO学堂

HarmonyOS Developer使用指南-示例教程

示例代码

Codelabs

视频教程

目录

订阅鸿蒙技术特刊，精选内容抢先看