# Codelabs **Repository Path**: harmony-source/codelabs ## Basic Information - **Project Name**: Codelabs - **Description**: 分享知识与见解，一起探索HarmonyOS的独特魅力。 - **Primary Language**: Unknown - **License**: Apache-2.0 - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 858 - **Created**: 2024-04-23 - **Last Updated**: 2024-06-05 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # HarmonyOS Codelabs - [概要简介](#section117915431558) - [目录](#sectionMenu) - [使用说明](#section1954919258619) - [约束与限制](#section682025019613) - [相关链接](#section01752910717) ## 概要简介 为帮助开发者快速熟悉HarmonyOS和OpenHarmony的能力以及相关的应用开发流程，我们提供了一系列的基于趣味场景的应用示例，即Codelabs，开发者可以根据我们的文档一步步的学习和完成简单项目的开发。 ## 目录 - 优秀案例 - [溪村小镇（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/OxHornCampus) - [一次开发，多端部署-购物应用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/MultiShopping) - [一次开发，多端部署-音乐专辑（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/MultiDeviceMusic) - [健康生活应用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/Healthy_life) - Ability开发 - [UIAbility和自定义组件生命周期（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/UIAbilityLifeCycle) - [UIAbility内页面间的跳转（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/PagesRouter) - [Stage模型下Ability的创建和使用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/StageAbilityDemo) - UI(ArkTS) - [一次开发，多端部署-视频应用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/Multi_device_V2) - [WaterFlow容器的使用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/WaterFlow) - [ArkTS与H5的交互（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SelectContact) - [电子相册（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/ElectronicAlbum) - [构建多种样式弹窗（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/MultipleDialog) - [简易计算器（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SimpleCalculator) - [自定义抽奖转盘（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/CanvasComponent) - [像素转换（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/PixelConversion) - [二级联动（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SecondLevelLinkage) - [目标管理（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/TargetManagement) - [弹性布局（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/FlexLayout) - [待办列表（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/ToDoListArkTS) - [ArkTS基础知识（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/RankingDemo) - [动效示例（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/Animation) - [转场动画的使用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/TransitionAnimation) - [自定义下拉刷新动画（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/AnimateRefresh) - [ArkUI常用布局容器对齐方式（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/LayoutAlign) - [常用组件与布局（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/ArkTSComponents) - [Web组件之cookie常见操作（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/WebCookie) - [Swiper的使用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SwiperArkTS) - [基础组件Slider的使用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SliderExample) - [List组件的用法之商品列表（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/List) - [List组件的用法之设置项（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/List-HDC) - UI(JS) - [image、image-animator组件的使用（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/ClickableJs) - [input、label组件的使用（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/InputApplication) - [rating组件的使用（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/RatingApplication) - [slider组件的使用（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SliderApplication) - [switch、chart组件的使用（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SwitchChart) - [弹窗基本使用（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/DialogDemo) - [动画样式（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/AnimationDemo) - [toolbar、toolbar-item组件的使用（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/ToolbarApplication) - [video组件的使用（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/VideoApplication) - [购物应用（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/ShoppingSample) - 公共事件与通知 - [系统公共事件（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SystemCommonEvent) - [进度条通知（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/DownloadNotification) - [闹钟（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/AlarmClock) - 窗口管理 - [窗口管理（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/WindowManager) - 媒体 - [录音机（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/Recorder) - [视频播放器（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/VideoPlayer) - [图片编辑（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/ImageEdit) - [简易视频播放器（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SimpleVideo) - [图片编辑（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/ImageEditorTemplate) - 网络与连接 - [新闻发布（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/NewsRelease) - [HTTPS请求过程（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/HttpsRequest) - [新闻数据加载（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/NewsDataArkTS) - [Web组件抽奖案例（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/WebComponent) - 数据库 - [关系型数据库（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/Rdb) - [首选项（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/Preferences) - [应用内字体大小调节（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SetAppFontSize) - [应用首次启动（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/FirstStartDemo_HOS) - 设备管理 - [计步器应用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/PedometerApp) - 分布式 - [分布式新闻客户端（ArkTS）（API 7）](https://gitee.com/harmonyos/codelabs/tree/master/DistributeNewsETS) - [分布式新闻客户端（JS）（API 7）](https://gitee.com/harmonyos/codelabs/tree/master/DistributeNewsJS) - [分布式手写板（JS）（API 7）](https://gitee.com/harmonyos/codelabs/tree/master/JSDistributeDraw) - [分布式鉴权（JS）（API 7）](https://gitee.com/harmonyos/codelabs/tree/master/GameAuth) - 卡片 - [音乐播放元服务和卡片（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/MusicPlay) - [健康生活卡片（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/Healthy_life) - [电影卡片（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/MovieCard) - [计步器卡片（JS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/StepsCardJS) - 效率提升 - [使用DevEco Studio高效开发（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/LoginDemo) - [常见组件和容器低代码开发示例（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/SuperVisualSample) - 三方库 - [库的调用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/ThirdPartyLibrary) - Native - [简易Native C++ 示例（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/NativeTemplateDemo) - [Native XComponent组件的使用（ArkTS）（API 9）](https://gitee.com/harmonyos/codelabs/tree/master/XComponent) ## 使用说明 1. 将独立的应用示例工程导入DevEco Studio进行编译构建及运行调试。 2. 部分应用示例中含有多个模块，开发者可以选择对单个模块进行编译构建，生成一个HAP应用安装包，也可以对整个工程进行编译构建，生成多个HAP应用安装包。 3. 安装运行后，即可在设备上查看应用示例运行效果，以及进行相关调试。 ## 约束与限制 1. 安装运行应用示例之前，请先通过config.json文件中的"deviceType"字段来确认该应用示例支持的设备类型，可尝试通过修改该字段使其可以在相应类型的设备上运行（config.json文件一般在代码的entry/src/main路径下，不同的Codelabs可能会有不同）。 2. 配置开发环境时，如果您想让应用示例运行到HarmonyOS上，请参考[DevEco Studio使用说明](https://developer.harmonyos.com/cn/docs/documentation/doc-guides/tools_overview-0000001053582387)。 3. IDE版本及配套SDK问题，可前往[DevEco Studio版本说明](https://developer.harmonyos.com/cn/docs/documentation/doc-releases/release_notes-0000001057597449)来查看详细的IDE、SDK、插件及Gradle配套版本。 4. 所有OpenHarmony相关Codelabs代码已被全部迁移至OpenHarmony组织之下的[Codelabs](https://gitee.com/openharmony/codelabs)仓中，本仓中不再体现。 ## 相关链接 1. HarmonyOS Codelabs官网：[HarmonyOS Codelabs](https://developer.harmonyos.com/cn/documentation/codelabs/) 2. OpenHarmony Codelabs仓：[OpenHarmony Codelabs](https://gitee.com/openharmony/codelabs)