HarmonyOS应用开发-手写板

        这是一个基于HarmonyOS做的一个手写板应用,只需要简单的几十行代码,就可以实现如下手写功能以及清空画布功能。

一、先上效果图:

二、上代码

@Entry
@Component
struct Index {//手写路径@State pathCommands: string = '';build() {Column() {//清空画布按钮Button("清空").onClick(() => {//将路径置空this.pathCommands = '';})Flex() {//如果路径不为空,那么展示path路径,// stokeWidth(5)表示画笔宽度为5,// fill('none')表示填充为空白,// stroke(Color.Blue)表示画笔为蓝色if (this.pathCommands != '') {Path().commands(this.pathCommands).strokeWidth(5).fill('none').stroke(Color.Blue)}}.onTouch((event: TouchEvent) => {//响应手势触摸操作this.onTouchEvent(event)}).width('100%').height('100%')}}onTouchEvent(event: TouchEvent) {//手指按下和移动时的位置转换成像素位置let x = vp2px(event.touches[0].x);let y = vp2px(event.touches[0].y);switch (event.type) {//手指按下case TouchType.Down://眺到(x,y)点this.pathCommands += 'M' + x + ' ' + y;break;//画线到(x,y)点case TouchType.Move:this.pathCommands += 'L' + x + ' ' + y;break;default:break;}}
}

在这个代码中,我们构建了一个手势绘图应用。以下是关键部分的解释:

  1. @Entry和@Component注解: 这两个注解用于标识这个类是一个入口点并且是一个组件。在HarmonyOS中,这是定义页面的标准方式。

  2. @State注解: 在HarmonyOS中,@State注解同样用于声明状态。在这里,我们声明了一个字符串类型的pathCommands,用于存储手势绘制的路径。

  3. build()函数:这个函数定义了HarmonyOS页面的结构,包括清空按钮和用于展示绘图路径的组件。

  4. onTouchEvent函数: 这个函数处理触摸事件,根据手指按下和移动的位置,将相应的绘制命令添加到路径中,实现了手势绘制的功能。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/214668.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

RocketMQ-源码架构

源码环境搭建 1、主要功能模块 RocketMQ官方Git仓库地址:GitHub - apache/rocketmq: Apache RocketMQ is a cloud native messaging and streaming platform, making it simple to build event-driven applications. RocketMQ的官方网站下载:下载 | R…

C++STL算法库中谓词的使用

什么是c的谓词 谓词概念: 谓词函数是一个判断式,一个返回bool值的函数或者仿函数,有几个入参就是几元谓词。一般做一个函数的参数使用【引用自百度百科】。 常见的可以作为谓词的东西:函数、函数指针、函数对象、lambda表达式&am…

2023 年浙江省职业院校技能大赛信息安全管理与评估赛项规程

*2023 年浙江省职业院校技能大赛“高职组”* *“信息安全管理与评估”赛项规程* *一、赛项名称* 赛项名称:信息安全管理与评估 英文名称:Information Security Management and Evaluation 赛项组别:高职 赛项归属产业:电子信…

热电厂发电机组常见故障及预测性维护方法

热电厂的发电机组是关键的能源生产设备,在电力供应中扮演着关键角色。但经过长期运行和高负荷工作,一旦发生故障,可能导致停机、设备损坏甚至引发严重事故。因此,实施有效的预测性维护方法对于确保发电机组的稳定运行至关重要。本…

Linux(17):认识与分析登录档

什么是登录档 【详细而确实的分析以及备份系统的登录文件】是一个系统管理员应该要进行的任务之一。 登录档 就是记录系统活动信息的几个文件,例如:何时、何地(来源IP)、何人(什么服务名称)、做了什么动作(讯息登录啰)。 换句话说就是:记录系…

【MySQL】:表的操作

表的操作 一.创建表二.查看表结构三.修改表四.删除表 一.创建表 field 表示列名。 datatype 表示列的类型。 character set 字符集,如果没有指定字符集,则以所在数据库的字符集为准。 collate 校验规则,如果没有指定校验规则,则以…

MySQL系列(二)——日志篇

MySQL日志 主要包括错误日志、查询日志、慢查询日志、事务日志、二进制日志几大类。其中,比较重要的还要属二进制日志binlog(归档日志)和事务日志redo log(重做日志)和undo log(回滚日志)。 今…

fastdds共享内存实现原理

fastdds 共享内存分两个部分,一部分用于保存数据,一部分用于通信。 fastrtps_“UUID”:共享内存包括又两部分数据,BufferNode和segment_size, 用配置文件port_queue_capacity_指定BufferNode的数量,segment_size用于保存实际传输的…

智物发布MT6877平台无线AR智能眼镜参考设计,推动下一代无线AR发展

随着增强现实(AR)技术的不断发展,有线AR眼镜在连接和使用方面存在一些限制。为了解决这些问题,无线AR智能眼镜的推出势在必行。 新一代无线AR智能眼镜采用了天玑900(MT6877)平台作为参考设计,搭载了2.4GHz的八核处理器…

【rabbitMQ】Exchanges交换机

上一篇:springboot整合rabbitMQ模拟简单收发消息 https://blog.csdn.net/m0_67930426/article/details/134904766 本篇代码基于上一篇继续写 目录 Fanout 交换机 1. add queue 2. add Exchange 3.绑定队列 Direct 交换机 1. add queue 2. add Exchange 3.…

011 数据结构_哈希

前言 本文将会向你介绍哈希概念,哈希方法,如何解决哈希冲突,以及闭散列与开散列的模拟实现 1. 哈希概念 顺序结构以及平衡树中,元素关键码与其存储位置之间没有对应的关系,因此在查找一个元素时,必须要经…

CyclicBarrier、CountDownLatch、Semaphore 的用法

CyclicBarrier、CountDownLatch、Semaphore 的用法 CountDownLatch(线程计数器 ) CountDownLatch 类位于 java.util.concurrent 包下,利用它可以实现类似计数器的功能。比如有一个任务 A,它要等待其他 4 个任务执行完毕之后才能执…

数据结构与算法-Rust 版读书笔记-2线性数据结构-队列

数据结构与算法-Rust 版读书笔记-2线性数据结构-队列 1、队列:先进先出 队列是项的有序集合,其中,添加新项的一端称为队尾,移除项的另一端称为队首。一个元素在从队尾进入队列后,就会一直向队首移动,直到…

鸿蒙原生应用再添新丁!同花顺入局鸿蒙

鸿蒙原生应用再添新丁!同花顺入局鸿蒙 来自 HarmonyOS 微博12月11日消息,同花顺已完成#鸿蒙原生应用#beta版本,并正在进行全量版本开发,进一步丰富了#鸿蒙原生应用#的覆盖领域。同花顺作为股民和券商首选的一站式金融理财服务平台…

扩展学习|商业智能和分析:从大数据到大影响

文献来源:Chen H, Chiang R H L, Storey V C. Business intelligence and analytics: From big data to big impact[J]. MIS quarterly, 2012: 1165-1188. 下载链接:https://pan.baidu.com/s/1JoHcTbwdc1TPGnwXsL4kIA 提取码:a8uy 在不同的组…

Vue-第七天

智慧商城项目: 1.创建项目选项: 2.调整: 主要是增加两个文件夹,删除倒是没什么 3.组件库(vant-ui): 点击进入官网:Vant 2 - Mobile UI Components built on Vue 4.导入: 全部导入…

MES系统需要具备哪些性能方面的需求?

MES系统需要具备哪些“性能需求”?关于这个问题,我觉得有必要先和大家解释一下,到底什么是性能需求?性能需求在MES系统的作用是什么?讲明白了这2点,问题自然而然就解决了。 什么是性能需求? 通…

选择最适合您的数据集成工具

个人 对于个人而言,选择最适合的数据集成工具可能会有一些不同的考量因素。以下是一些个人选择数据集成工具时可能需要考虑的因素: 技术水平和经验: 如果个人具有较深的技术水平和经验,可能更倾向于选择功能丰富、灵活性强的数据…

自编码器 AutoEncoder

自编码器(AutoEncoder),也称自编码模型,是一种基于无监督学习的数据维度压缩和特征表示方法,目的是对一组数据学习出一种表示。1986年 Rumelhart 提出自编码模型用于高维复杂数据的降维。由于自动编码器通常应用于无监…

《PySpark大数据分析实战》-02.了解Hadoop

📋 博主简介 💖 作者简介:大家好,我是wux_labs。😜 热衷于各种主流技术,热爱数据科学、机器学习、云计算、人工智能。 通过了TiDB数据库专员(PCTA)、TiDB数据库专家(PCTP…