原文:https://mp.weixin.qq.com/s/sPDG5sG5F_gTp0cE1VV3gQ,点击链接查看更多技术内容。
 
今年的华为开发者大会上我们发布了HarmonyOS 3.1 Developer Preview版本,开启对API 9的支持。本期我们将为大家带来5个基于API 9实现的Sample。开发者可以从中掌握声明式开发范式的核心机制和功能,同时还能从中学习到分布式设备管理与分布式数据管理等前沿技术用法,让我们先睹为快!

一、Sample 1:一多天气

简介:

本Sample展示一个天气应用,包括首页、城市管理、添加城市、更新时间弹窗,体现一次开发,多端部署的能力。

通过学习本Sample,可以掌握如何使用一套代码,实现应用在不同屏幕尺寸下,保持整体风格一致性的同时,还能保障各设备上应用界面体验的差异性。

一多天气显示

重点剖析:

1、本示例参考一次开发,多端部署的指导,主要使用响应式布局的栅格断点系统实现在不同尺寸窗口界面上不同的显示效果。

2、使用SideBarContainer实现侧边栏功能。

3、使用栅格容器组件实现界面内容的分割和展示。

响应式布局

4、使用Canvas和Canvas-Rendering-Context2D完成空气质量和日出月落图的曲线绘制。

源码下载链接:

https://gitee.com/openharmony/applications_app_samples/tree/master/MultiDeviceAppDev/Weather

二、Sample 2:自定义分享

简介:

本Sample展示自定义分享,主要是发送方应用将文本、链接、图片等分享给三方应用并展示。

通过学习本sample,可以掌握数据的请求与响应,屏幕截图设置,文件管理,媒体服务等相关能力。

重点剖析:

1、自定义分享支持文本+链接分享、应用内文件分享、其他应用分享。

2、自定义分享弹窗展示支持分享的应用,点击应用后可将内容分享到该应用并展示。

3、分享内容时,支持生成海报,通过弹窗获取海报内容并分享。

源码下载链接:

https://gitee.com/openharmony/applications_app_samples/tree/master/Share/CustomShare

三、Sample 3:拼图

简介:

本Sample展示基于Grid组件实现的拼图,通过image (图片处理)和medialibrary (媒体库管理)接口实现图片的获取、裁剪及分割。

通过学习本Sample,可以掌握媒体库管理、图片处理、Grid组件等相关能力。

拼图界面

重点剖析:

1、图片打包器:用于图片压缩和打包,通过createImagePacker构建一个图片打包器实例。

2、媒体库管理:获取媒体库的实例,用于访问和修改用户等个人媒体数据信息(如音频、视频、图片、文档等)。

源码下载链接:

https://gitee.com/openharmony/applications_app_samples/tree/master/media/GamePuzzle

四、Sample 4:分布式五子棋

简介:

本Sample展示一款分布式五子棋游戏,该游戏基于分布式数据管理实现,使用Canvas组件实现棋盘、棋子的绘制,使用分布式数据管理实现设备间数据的同步。

通过学习本Sample,可以掌握Canvas组件、分布式数据管理、设备管理等相关能力。

分布式五子棋界面

重点剖析:

1、棋盘、棋子模块是用Canvas组件绘制出棋盘、棋子。

棋盘、棋子模块

2、分布式设备列表弹窗:实现了远端设备的选择,用户可以根据设备名称选择相应的设备进行协同计算。

分布式设备列表弹窗

3、远端设备拉起:通过startAbility(deviceId)方法拉起远端设备。

源码下载链接:

https://gitee.com/openharmony/applications_app_samples/blob/master/data/DistributedDataGobang

五、Sample 5:组件集合

简介:

本Sample展示组件集合,包含ArkUI的组件、通用能力、动画和全局方法。

通过学习本Sample,开发者可以直观的学习并掌握各UI组件的使用。

重点剖析:

1、组件集合使用Tabs容器组件搭建整体应用框架,每个内容视图使用List容器组件布局。

2、在每个ListItem中使用循环渲染加载子数据,底部导航菜单使用TabContent实现自定义样式。

源码下载链接:

https://gitee.com/openharmony/applications_app_samples/tree/master/ETSUI/ComponentCollection

以上就是本期基于API 9上新的Sample介绍,赶快通过链接下载学习吧!

支持API 9的Sample已上新,速来拿走的更多相关文章

  1. Tapdata Cloud 版本上新 | 支持通知自配置,支持GP、MQ数据源,界面更友好!

    Tapdata Cloud https://cloud.tapdata.net Tapdata Cloud 是国内首家异构数据库实时同步云平台,目前支持Oracle.MySQL.PG.SQL Serv ...

  2. Tapdata Cloud 2.1.4 来啦:数据连接又上新,PolarDB MySQL、轻流开始接入,可自动标记不支持的字段类型

      需求持续更新,优化一刻不停--Tapdata Cloud 2.1.4 来啦!   最新发布的版本中,在新增数据连接之余,默认标记不支持同步的字段类型,避免因此影响任务的正常运行. 更新速览 ① 数 ...

  3. Tapdata Cloud 版本上新!新增TiDB等数据源支持,连接和任务功能增强,体验更优

    Tapdata Cloud cloud.tapdata.net Tapdata Cloud 是国内首家异构数据库实时同步云平台,目前支持Oracle.MySQL.PG.SQL Server.Mongo ...

  4. Tapdata Cloud 版本上新!新增ClickHouse,ADB MySQL等5个数据源支持

    Tapdata Cloud cloud.tapdata.net Tapdata Cloud 是国内首家异构数据库实时同步云平台,目前支持Oracle.MySQL.PG.SQL Server.Mongo ...

  5. springboot实战开发全套教程,让开发像搭积木一样简单!Github星标已上10W+!

    前言 先说一下,这份教程在github上面星标已上10W,下面我会一一给大家举例出来全部内容,原链接后面我会发出来!首先我讲一下接下来我们会讲到的知识和技术,对比讲解了多种同类技术的使用手日区别,大家 ...

  6. 【百度地图API】如何在地图上添加标注?——另有:坐标拾取工具+打车费用接口介绍

    原文:[百度地图API]如何在地图上添加标注?--另有:坐标拾取工具+打车费用接口介绍 摘要: 在这篇文章中,你将学会,如何利用百度地图API进行标注.如何使用API新增的打车费用接口. ------ ...

  7. Java学习笔记--脚本语言支持API

    Java语言的动态性之脚本语言支持API 随着Java平台的流行,很多的脚本语言(scripting language)都可以运行在Java虚拟机啊上,其中比较流行的有JavaScript.JRuby ...

  8. HTML5关于上传API的一些使用(上)

    HTML5提供了很多有用的API,其中就包括上传的API,XMLHttpRequest2.0,在HTML5时代之前,需要进行二进制的上传一般都会才用flash的方案,但是当XMLHttpRequest ...

  9. 用html5文件api实现移动端图片上传&预览效果

    想要用h5在移动端实现图片上传&预览效果,首先要了解html5的文件api相关知识(所有api只列举本功能所需): 1.Blob对象  Blob表示原始二进制数据,Html5的file对象就继 ...

  10. 开发平台支持Arm Cortex-M的微控制器上人工智能训练

    开发平台支持Arm Cortex-M的微控制器上人工智能训练 Development platform enables AI training on Arm Cortex-M-based microc ...

随机推荐

  1. 16. Class字节码结构

    1. 相关概念 1.1字节码文件的跨平台性 Java 语言是跨平台的(write once, run anywhere) 当 Java 源代码成功编译成字节码后,如果想在不同的平台上面运行, 则无须再 ...

  2. Java //手动输入3个数,并从小到大排序

    1 //手动输入3个数,并从小到大排序 2 //import java.util.Sanner; 3 4 System.out.println("请输入第一个数:"); 5 Sca ...

  3. minio通过docker方式部署

    MinIO 是在 GNU Affero 通用公共许可证 v3.0 下发布的高性能对象存储. 它是与 Amazon S3 云存储服务兼容的 API 官方文档http://docs.minio.org.c ...

  4. Handler源码解析

    Handler源码解析 一.基本原理回顾 在android开发中,经常会在子线程中进行一些操作,当操作完毕后会通过handler发送一些数据给主线程,通知主线程做相应的操作. 探索其背后的原理:子线程 ...

  5. HiSi 3516CV500 NNIE(Neural Network Inference Engine) 摸鱼记录(3) ---真机调试(实例分析)

    PS:要转载请注明出处,本人版权所有. PS: 这个只是基于<我自己>的理解, 如果和你的原则及想法相冲突,请谅解,勿喷. 前置说明   本文作为本人csdn blog的主站的备份.(Bl ...

  6. [leetcode 496. 下一个更大元素 I] 单调栈

    单调栈的写法: import java.util.ArrayDeque; import java.util.Deque; import java.util.HashMap; import java.u ...

  7. vim的使用进步

    vim的使用进步 1.如果遇到命令行中无法退出的 狂按esc按键 或者也可以使用v模式下切换一下,之后按esc 保存退出 保存退出--:wq 保存:w 不保存退出:q! i--插入模式 v- 可视化模 ...

  8. Excalidraw:绘制图形的新利器

    摘要: Excalidraw是一款简洁设计.直观易用的绘图应用,用户可以通过它创建流程图.示意图.架构图等各种图形.除了提供手绘效果外,Excalidraw还支持多人实时协作编辑,并提供端到端加密以确 ...

  9. 记录--源码视角,Vue3为什么推荐使用ref而不是reactive

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 ref 和 reactive 是 Vue3 中实现响应式数据的核心 API.ref 用于包装基本数据类型,而 reactive 用于处理对 ...

  10. 构建个人博客网站(基于Python Flask)

    本文由 Ficow Shen 首发于 Ficow Shen's Blog. 文章概览 前言 Sketch HTML, CSS, JavaScript Python & Flask & ...