0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
会员中心
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

HarmonyOS原子化服务开发快速入门教程(上)

鸿蒙时代 来源:鸿蒙时代 作者:鸿蒙时代 2022-06-16 16:44 次阅读
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

HarmonyOS原子化服务开发快速入门教程(上)

原创蛟龙腾飞收纳专栏 :Harmonyos 28 分钟前 2

学习说明

1.开发者具备JS与前端开发语言入门级及以上基础。

2.已经安装好DevEco Studio。本案例用的DevEco Studio 3.0.0.800,API4-7都可以体验。

3.开发者已经注册与实名认证华为开发者联盟账户。

4.Empty Ability工程模板, JavaScript语言开发,支持低代码开发,用于Phone、TV、Tablet、Wearable设备的Feature Ability模板,展示了基础的Hello World功能。

5.Immersive Data(沉浸式数据模板)服务卡片模板,支持设备Phone/Tablet/Wearable,JavaScript语言开发,此类型卡片是在沉浸式图片上呈现数据信息,可以使用不同的图标搭配信息进行呈现,强调使用场景与数据之间的关系,开发者可以发挥图文搭配的优势,创造出独特风格的卡片样式。

6.课件里提供了本案例单独说明文档与代码包,可以直接引用体验。

目录:

  • 创建项目
  • 创建卡片
  • 修改代码
  • 运行效果
  • 多设备效果显示
  • 学习说明

一、创建项目

  1. 创建工程项目

打开DevEco Studio选择你的Ability 模板,这里我们选择Empty Ability模板,然后点击Next进行下一步。如图1所示。

%E5%9B%BE%E7%89%871.png

图1

2.配置工程项目

配置的项目工程,如图2和图3所示,然后单击Finish创建。

%E5%9B%BE%E7%89%872.png

图2

%E5%9B%BE%E7%89%873.png

图3

二、创建卡片

  1. 找到entry中src->main下的js文件,右击选择new中的Service Widget选项,如图4所示。

%E5%9B%BE%E7%89%874.png

图4

选择immersive Data卡片模板,如图5所示,点击Next进行下一步。

%E5%9B%BE%E7%89%875.png

图5

配置卡片模板信息,如图6,然后点击Finish创建。

%E5%9B%BE%E7%89%876.png

图6

审核编辑:符乾江

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 代码
    +关注

    关注

    30

    文章

    4941

    浏览量

    73150
  • HarmonyOS
    +关注

    关注

    80

    文章

    2146

    浏览量

    35577
  • 原子化服务
    +关注

    关注

    0

    文章

    31

    浏览量

    1054
收藏 人收藏
加入交流群
微信小助手二维码

扫码添加小助手

加入工程师交流群

    评论

    相关推荐
    热点推荐

    HarmonyOS 5】金融应用开发鸿蒙组件实践

    HarmonyOS 5】金融应用开发鸿蒙组件实践 ##鸿蒙开发能力 ##HarmonyOS SDK应用服务##鸿蒙金融类应用 (金融理财#
    的头像 发表于 07-11 18:20 752次阅读
    【<b class='flag-5'>HarmonyOS</b> 5】金融应用<b class='flag-5'>开发</b>鸿蒙组件实践

    HarmonyOS 5】鸿蒙应用实现发票扫描、文档扫描输出PDF图片或者表格的功能

    HarmonyOS 的 ** 文档扫描控件(DocumentScanner)** 是 AI Vision Kit 提供的核心场景视觉服务,旨在帮助开发
    的头像 发表于 07-11 18:16 873次阅读
    【<b class='flag-5'>HarmonyOS</b> 5】鸿蒙应用实现发票扫描、文档扫描输出PDF图片或者表格的功能

    HarmonyOS 5 入门系列 】鸿蒙HarmonyOS示例项目讲解

    HarmonyOS 5 入门系列 】鸿蒙HarmonyOS示例项目讲解 ##鸿蒙开发能力 ##HarmonyOS SDK应用
    的头像 发表于 07-07 11:57 796次阅读
    【 <b class='flag-5'>HarmonyOS</b> 5 <b class='flag-5'>入门</b>系列 】鸿蒙<b class='flag-5'>HarmonyOS</b>示例项目讲解

    HarmonyOS入门指南

    1、文档与教程 HarmonyOS开发文档-应用开发导读 OpenHarmony--应用开发导读 仓颉编程语言官网 华为开发者博客 华为
    的头像 发表于 06-27 00:11 559次阅读

    HarmonyOS5云服务技术分享--Serverless抽奖模板部署

    测试服务PTS 希望这篇教程能帮你快速上手!如果部署过程中遇到问题,欢迎在评论区留言交流~ 也欢迎关注我的技术博客,每周更新HarmonyOS开发实战技巧。祝各位
    发表于 05-22 20:25

    HarmonyOS5云服务技术分享--云数据库使用指南

    ? 华为云数据库(CloudDB)在HarmonyOS中的使用指南 ? ​​嗨,开发者朋友们!​​ 今天咱们来聊聊华为云数据库(CloudDB)在HarmonyOS应用中的集成和使用技巧。无论你是刚
    发表于 05-22 18:29

    HarmonyOS5云服务技术分享--ArkTS开发函数

    ✨【手把手教你玩转HarmonyOS云函数调试】✨ Hey 开发者朋友们!今天咱们来聊聊怎么用命令行快速调试HarmonyOS的云函数,让你开发
    发表于 05-22 17:29

    HarmonyOS5云服务技术分享--ArkTS开发Node环境

    气的方式探索这个功能,结尾还有实用总结和鼓励彩蛋哦~✨ ? 一、HarmonyOS云函数开发:核心能力与价值 HarmonyOS的云函数(Serverless)为开发者提供了​​无
    发表于 05-22 17:21

    HarmonyOS5云服务技术分享--认证文档问题

    各位开发者朋友好!本文将详细讲解如何基于HarmonyOS ArkTS框架集成华为AppGallery Connect(AGC)认证服务,涵盖从项目创建到SDK集成全流程。无论您是首次接入AGC
    发表于 05-22 13:20

    鸿蒙应用元服务开发-Account Kit概述

    》等相关协议条款及现行法律法规,平台制定了华为账号登录管理细则,使用华为账号登录的元服务请遵照执行,具体要求如下: (一)架审核要求 华为账号提供的登录能力方便元服务获取用户的身份标识,快速
    发表于 03-31 12:08

    HarmonyOS NEXT 原生应用/元服务调试概述

    开发者更方便、高效地调试应用/元服务HarmonyOS应用/元服务调试支持使用真机设备、模拟器、预览器调试。接下来以使用真机设备为例进行说明,详细的调试流程如下图所示: 1.配置签
    发表于 02-26 11:03

    HarmonyOS 应用开发赋能套件:鸿蒙原生应用开发的 “神助攻”

    。   在这个阶段,重点推荐《HarmonyOS第一课》和《HarmonyOS应用开发快速入门》,其中《
    发表于 02-17 16:37

    HarmonyOS第一课》焕新升级,赋能开发快速掌握鸿蒙应用开发

    云梯 《HarmonyOS第一课》分为基础、中级、高级及主题课程四大模块,为不同层次开发者量身定制学习路径。 基础课程针对初级开发者,使其能够在指导下让开发
    发表于 01-02 14:24

    HarmonyOS开发指导类文档更新速递(下)

    伴随着HarmonyOS 5.0.0 Release、HarmonyOS 5.0.1 Release版本的发布,HarmonyOS官网文档也带来了不少上新内容。本期HarmonyOS
    的头像 发表于 12-30 09:54 2136次阅读
    <b class='flag-5'>HarmonyOS</b><b class='flag-5'>开发</b>指导类文档更新速递(下)

    HarmonyOS开发指导类文档更新速递()

    伴随着HarmonyOS 5.0.0 Release版本的发布,HarmonyOS官网文档也带来了不少上新内容。本期HarmonyOS NEXT开发者资料直通车将从文档更新角度为
    的头像 发表于 12-30 09:50 1756次阅读
    <b class='flag-5'>HarmonyOS</b><b class='flag-5'>开发</b>指导类文档更新速递(<b class='flag-5'>上</b>)