鸿蒙OpenHarmony【canvas组件】JS组件

樱桃老丸牛犊子

494人浏览 · 2024-12-13 21:03:42

樱桃老丸牛犊子 · 2024-12-13 21:03:42 发布

提供画布组件。用于自定义绘制图形。

说明

该组件从从API version 5 开始支持。后续版本如有新增内容，则采用上角标单独标记该内容的起始版本。

子组件

不支持。

属性

名称	类型	默认值	必填	描述
id	string	-	否	组件的唯一标识。
style	string	-	否	组件的样式声明。
class	string	-	否	组件的样式类，用于引用样式表。
ref	string	-	否	用来指定指向子元素的引用信息，该引用将注册到父组件的$refs 属性对象上。

事件

名称	参数	描述
click	-	点击动作触发该事件。
longpress	-	长按动作触发该事件。
swipe5+	[SwipeEvent]	组件上快速滑动后触发。

样式

名称	类型	默认值	必填	描述
width		5+	-	否
height		5+	-	否
padding		0	否	使用简写属性设置所有的内边距属性。该属性可以有1到4个值：- 指定一个值时，该值指定四个边的内边距。- 指定两个值时，第一个值指定上下两边的内边距，第二个指定左右两边的内边距。- 指定三个值时，第一个指定上边的内边距，第二个指定左右两边的内边距，第三个指定下边的内边距。- 指定四个值时分别为上、右、下、左边的内边距（顺时针顺序）。
margin		5+	0	否
margin-[left	top	right	bottom]
border-width		0	否	使用简写属性设置元素的所有边框宽度。
border-color		black	否	使用简写属性设置元素的所有边框颜色。
border-radius		-	否	border-radius属性是设置元素的外边框圆角半径。
background-color		-	否	设置背景颜色。
display	string	flex	否	确定一个元素所产生的框的类型，可选值为：- flex：弹性布局。- none：不渲染此元素。
[left	top]		6+	-

方法

名称	参数	描述
getContext	string	获取canvas绘图上下文，参数仅支持“2d”，返回值为2D绘制对象，该对象提供具体的2D绘制操作。

欢迎加入Laval社区

社区规范：仅讨论OpenHarmony相关问题。

更多推荐

OpenHarmony 回调函数使用心得：从接口声明到异步结果处理

在 OpenHarmony 的应用开发和系统适配过程中，回调函数是一种非常常见的编程方式。它可以将“事件发生之后要执行什么操作”交给调用方定义，从而降低模块之间的耦合度。通过对 OpenHarmony 地图模块中 POI 搜索、网络适配和渲染流程的分析，我对回调函数的理解更加具体。回调函数并不只是“把一个函数传给另一个函数”，它实际上包含了接口设计、函数实现、回调注册、事件触发和结果处理等完整流

Laval社区

数据传输改造

数据传输改造小记：从等推送，到自己出门打饭做嵌入式久了，多少都有点"队列情结"。数据嘛，天经地义应该从串口那头流过来，进队列，后面慢慢消费。我一开始也是这么想的，直到这套东西在 MH1000 上开始作妖。以前的队列是怎么干活的老路子很标准：MCU 主动推 CMC 帧，串口收进来塞进队列，数据中心的解析任务用 xQueueReceive 一条条掏出来解，解完往 field_

Laval社区

通知栏时间显示异常

概述在某些系统版本中，设备系统时间设置为 12 小时制，下午 13:00 发起一条通知，通知栏中显示的时间却是 01:00。这是一个时间格式转换的 bug——系统按 24 小时制处理了时间，但没有根据用户的 12 小时制设置做格式化，导致下午 13点被错误地显示为 01 点。说明这个问题的根源在于时间格式化时没有读取系统的时间制式配置。HarmonyOS 中获取系统时间格式的接口是