今年 HDC.Together 2023 的 Codelabs 挑战系列活动如期而至，众多开发者齐聚一堂，积极参与。本次赛题中部分 Codelabs 已在官网上线详细操作指南，让我们与众多 coders 一起探索代码的独特魅力。
01 ArkTS 基础知识（ArkTS）
本课程使用声明式语法和组件化基础知识，搭建一个可刷新的排行榜页面。在排行榜页面中，使用循环渲染控制语法来实现列表数据渲染，使用 @Builder 创建排行列表布局内容，使用装饰器 @State、@Prop、@Link 来管理组件状态。最后我们点击系统返回按键，来学习自定义组件生命周期函数。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
02 转场动画的使用（ArkTS）
在本教程中，我们将会通过一个简单的样例，学习如何基于 ArkTS 的声明式开发范式开发转场动画。其中包含页面间转场、组件内转场以及共享元素转场。
操作指南：
https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
03 Swiper 的使用（ArkTS）
本篇 Codelab 主要介绍了滑动容器组件 Swiper 的几种常见的应用场景，包括顶部导航、轮播图以及视频滑动播放。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
04 构建多种样式弹窗（ArkTS）
本篇 Codelab 将介绍如何使用弹窗功能，实现四种类型弹窗。分别是：警告弹窗、自定义弹窗、日期滑动选择器弹窗、文本滑动选择器弹窗。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
05 二级联动（ArkTS）
本篇 Codelab 主要介绍如何基于 List 组件实现一个导航和内容的二级联动效果。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
06 弹性布局（ArkTS）
本篇 Codelab 主要介绍如何基于 Flex 容器组件特性，实现弹性布局效果。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
07 闹钟（ArkTS）
本篇 Codelab 主要介绍如何基于 ArkTS 的声明式开发范式及 HarmonyOS 的后台代理提醒能力，实现简单的闹钟提醒功能。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
08 图片编辑（ArkTS）
本篇 Codelab 主要介绍如何基于图片编解码，实现图片编辑，包含裁剪、旋转、色域调节（本文只介绍亮度、透明度、饱和度）等功能。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
09 视频播放器（ArkTS）
本篇 Codelab 基于 HarmonyOS 的播放管理类（AVPlayer），使用 ArkTS 语言实现视频播放器，主要包括视频获取和视频播放功能。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
10 电子相册（ArkTS）
本篇 Codelab 介绍了基于 ArkTS 实现一个电子相册的案例，通过捏合和拖拽手势控制图片的放大、缩小、左右拖动查看细节等效果。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
11 一次开发，多端部署-音乐专辑（ArkTS）
本篇 Codelab 基于自适应布局和响应式布局，实现一次开发，多端部署音乐专辑。介绍手机、折叠屏、平板等不同屏幕尺寸设备的页面设计和实现方案，通过合理的工程结构组织代码，以及解决系统能力差异的兼容性问题。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
12 一次开发，多端部署-购物应用（ArkTS）
本篇 Codelab 基于自适应布局和响应式布局，实现购物应用在手机、折叠屏、平板不同屏幕尺寸设备上按不同设计显示。通过三层工程结构组织代码，实现一次开发，多端部署。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
13 健康生活卡片（ArkTS）
本篇 Codelab 基于健康生活应用实现 ArkTS 卡片，介绍卡片的开发及生命周期。实现 2x2 和 2x4 规格的卡片功能，并通过关系型数据库完成创建、查询、添加、删除卡片数据。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
14 溪村小镇
溪村小镇是一款展示溪流背坡村园区风貌的应用，包括园区内的导航功能，小火车行车状态查看，以及各区域的风景展览介绍，主要用于展示 HarmonyOS 的 ArkUI 能力和动画效果。
操作指南：https://developer.huawei.com/consumer/cn/codelabsPortal/cardd...
除了丰富的 Codelabs 供开发者学习，为了帮助大家更好地了解本次 HDC 大会期间发布的最新开发资料，论坛更是为大家准备了鸿蒙生态资料锦集，带您快速了解鸿蒙生态，轻松开启 HarmonyOS 应用开发旅程，实现共建、共享、共赢。
2023 HDC.Together | 鸿蒙生态资料锦集：https://developer.huawei.com/consumer/cn/forum/topic/02111265...
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用。你还可以使用@来通知其他用户。