当前位置: 首页 > news >正文

鸿蒙OpenHarmony开发实战:【MiniCanvas】

介绍

基于OpenHarmony的Cavas组件封装了一版极简操作的MiniCanvas,屏蔽了原有Canvas内部复杂的调用流程,支持一个API就可以实现相应的绘制能力,该库还在继续完善中,也欢迎PR。

使用说明
  1. 添加MiniCanvas依赖

    在项目entry目录执行如下命令安装MiniCanvas库:

    npm install git+https://gitee.com/ark-ui/MiniCanvas.git
  2. 引入MiniCanvas

    import { MiniCanvas, Paint, ICanvas } from '@ohos/mini_canvas'
  3. 使用MiniCanvas

    @Entry @Component struct TestMiniCanvas {build() {Column() {MiniCanvas({onDraw: (canvas) => {}})}.size({width: "100%", height: "100%"})}
    }
  4. MiniCanvas绘制

    // import { MiniCanvas, Paint, ICanvas } from '@ohos/mini_canvas'
    // 源码方式引入
    import { MiniCanvas, Paint } from "./mini_canvas"@Entry @Component struct TestMiniCanvas {build() {Column() {MiniCanvas({// 在onDraw()方法内执行绘制onDraw: (canvas) => {// 创建画笔let paint = new Paint()// 绘制直线paint.setColor("#FF0000");paint.setStrokeWidth(5);canvas.drawLine(10, 10, 280, 10, paint);// 绘制圆以及圆环canvas.drawCircle(50, 50, 25, paint);paint.setStroke(true);paint.setStrokeWidth(3);canvas.drawCircle(250, 50, 25, paint);// 绘制椭圆以及椭圆环paint.setStroke(false);canvas.drawOval(20, 100, 150, 50, paint)paint.setStroke(true);paint.setColor(Color.Pink.toString())canvas.drawOval(190, 100, 150, 50, paint)// 绘制矩形paint.setStroke(false)canvas.drawRect(20, 180, 150, 50, paint)paint.setStroke(true)paint.setStrokeWidth(5)canvas.drawRect(190, 180, 150, 50, paint)// 绘制圆角矩形paint.setStroke(false);canvas.drawRoundRect(20, 250, 150, 50, 10, paint)paint.setStroke(true);canvas.drawRoundRect(190, 250, 150, 50, 10, paint)// 绘制圆弧canvas.drawArc(80, 330, 40, 0, 135, paint);paint.setStroke(false);canvas.drawArc(250, 330, 40, 0, 135, paint);// 绘制图片let bitmap = new ImageBitmap("pages/test.jpg")canvas.drawImage(bitmap, 10, 10, 800, 600, 20, 400, 320, 160, paint)},// 设置画布的属性attribute: {id: "mini_canvas",width: "100%",height: "100%",background: "#ffffff",clickListener: (event) => {console.log("onClicked: " + JSON.stringify(event));},touchListener: (event) => {console.log("onTouched: " + JSON.stringify(event));}},})}.size({width: "100%", height: "100%"})}
    }

鸿蒙知识已更新gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md可前往参考学习。

鸿蒙OpenHarmony-ArkUI声明式UI开发.png

  1. 运行结果

    sample

鸿蒙值得开发者入行

为什么这么说?市场是决定人力需求的,数据说话最管用:

1、鸿蒙其全栈自研,头部大厂商都陆续加入合作开发鸿蒙原生应用——人才需求上涨

2、鸿蒙作为新系统、新技术,而现在市面上技术人才少——高薪招聘开启

3、鸿蒙1+8+N生态,不仅只有应用开发;还有车载、数码、智能家居、家电等——就业范围广

4、纯血鸿蒙,目前没有多少人熟悉。都处于0基础同一起跑线——无行业内卷

开发者最需要什么?岗位多、薪资高、不内卷、行业竞争低。而当下的鸿蒙恰恰符合要求。

那么这么好的鸿蒙岗位,应聘要求都很高吧?其实不然鸿蒙作为新出的独立系统,其源头上大家都处于同一水平线上,一开始的技术要求都不会很高,毕竟面试官也是刚起步学习。招聘要求示例:

从信息看出,几乎应职要求是对标有开发经验的人群。可以说鸿蒙对开发者非常友好,尽管上面没提鸿蒙要求,但是面试都会筛选具有鸿蒙开发技能的人。我们程序员都知道学习开发技术,最先是从语言学起,鸿蒙语言有TS、ArkTS等语法,那么除了这些基础知识之外,其核心技术点有那些呢?下面就用一张整理出的鸿蒙学习路线图表示:

从上面的OpenHarmony技术梳理来看,鸿蒙的学习内容也是很多的。现在全网的鸿蒙学习文档也是非常的少,下面推荐一些:完整内容可在头像页保存,或这qr23.cn/AKFP8k甲助力

内容包含:

  • ArkTS
  • 声明式ArkUI
  • 多媒体
  • 通信问题
  • 系统移植
  • 系统裁剪
  • FW层的原理
  • 各种开发调试工具
  • 智能设备开发
  • 分布式开发等等。

这些就是对往后开发者的前景分享,希望大家多多点赞关注喔!

相关文章:

鸿蒙OpenHarmony开发实战:【MiniCanvas】

介绍 基于OpenHarmony的Cavas组件封装了一版极简操作的MiniCanvas,屏蔽了原有Canvas内部复杂的调用流程,支持一个API就可以实现相应的绘制能力,该库还在继续完善中,也欢迎PR。 使用说明 添加MiniCanvas依赖 在项目entry目录执行…...

【JavaEE初阶系列】——单例模式 (“饿汉模式“和“懒汉模式“以及解决线程安全问题)

目录 🚩单例模式 🎈饿汉模式 🎈懒汉模式 ❗线程安全问题 📝加锁 📝执行效率提高 📝指令重排序 🍭总结 单例模式,非常经典的设计模式,也是一个重要的学科&#x…...

flutter-elinux的基本介绍及安装调试

搜集到两个很有用的网站: 1、flutter-elinux的基本介绍:https://juejin.cn/post/7257285697383612453 2、flutter-elinux的安装调试等:https://github.com/sony/flutter-elinux/wiki 其中,在flutter-elinux设置环境变量时&#…...

二分查找法总结

目录 1、思路讲解(LC704)2、代码思路讲解(循环不变量)(1) 左闭右闭(2)左闭右开(3)总结:左开右闭和左闭右开(4)复杂度分析 …...

Python工具-清理Unity(批量深度)清理U3D项目工程保留关键工程文件

前沿 1. Unity工程越来越多,很久不用的工程里存在了很多无用的大文件夹,极大的影响电脑容量。 2. 我电脑里面U3D工程只有17个,但容量就高达60GB,使用自己编写的工具清理后,减到了30GB多。清理了不是很重要的文件和文件…...

vue 安装脚手架报错 certificate has expired

vue 安装脚手架的时候报错,报错信息如下: 错误信息:npm ERR! request to https://registry.npm.taobao.org/vue%2fcli failed, reason: certificate has expired 翻译:npm ERR!请求到https://registry.npm.taobao.org…...

使用 Python 快速开始机器学习

🔗 快速开始 PyTorch|使用 Python 建立深度学习模型 认识 PyTorch 1.1 Torch 与 PyTorch 1.2 安装 PyTorch 1.3 验证安装并查看 PyTorch 版本PyTorch 深度学习模型的建立范式 2.1 准备数据 2.2 定义模型 2.3 训练模型 2.4 评估模型 2.5 做出预测为预测任…...

CCDP.02.OS正确部署后的Dashboard摘图说明

前言 在部署成功OpenStack后,应该可以在浏览器打开Dashboard,并对计算资源(这里主要是指VM)进行管理,也可以在Dashboard上面查看OpenStack是否存在错误,下面,已针对检查的关键点,用红…...

【计算机视觉】Gaussian Splatting源码解读补充(二)

第一部分 本文是对学习笔记之——3D Gaussian Splatting源码解读的补充,并订正了一些错误。 目录 三、相机相关scene/cameras.py:class Camera 四、前向传播(渲染):submodules/diff-gaussian-rasterization/cuda_rast…...

Java transient 关键字

Java字段不想序列化怎么办 在 Java 中,如果某个字段不想被序列化(即不希望被写入到序列化的数据流中),可以使用 transient 关键字进行标记。通过在字段前加上 transient 关键字,可以告诉 Java 序列化机制忽略该字段&am…...

前端工程化(三)邂逅Webpack和打包过程

目录 Vue项目加载Webpack 安装Webpack的默认打包创建局部的 webpack Vue项目加载 JavaScript的打包:  将ES6转换成ES5的语法;  TypeScript的处理,将其转换成JavaScript; Css的处理:  CSS文件模块的加载、提取&a…...

Gradle v8.5 笔记 - 从入门到进阶(基于 Kotlin DSL)

目录 一、前置说明 二、Gradle 启动! 2.1、安装 2.2、初始化项目 2.3、gradle 项目目录介绍 2.4、Gradle 项目下载慢?(万能解决办法) 2.5、Gradle 常用命令 2.6、项目构建流程 2.7、设置文件(settings.gradle…...

Jmeter-基础元件使用(二)-属性及对数据库简单操作

一、Jmeter属性 当我们想要在不同线程组中使用某变量,就需要使用属,此时Jmeter属性的设置需要函数来进行set和get操作 1.创建set函数 2.然后采用Beanshell取样器进行函数执行 3.调用全局变量pro_id 4.将上面生成的函数字符串粘贴到另一个线程组即可…...

docker 的八大技术架构(图解)

docker 的八大技术架构 单机架构 概念: 应用服务和数据库服务公用一台服务器 出现背景: 出现在互联网早期,访问量比较小,单机足以满足需求 架构优缺点: 优点:部署简单,成本低 缺点&#xff1…...

LeetCode-热题100:131. 分割回文串

题目描述 给你一个字符串 s,请你将 s 分割成一些子串,使每个子串都是 回文串 。返回 s 所有可能的分割方案。 示例 1: 输入: s “aab” 输出: [[“a”,“a”,“b”],[“aa”,“b”]] 示例 2: 输入&am…...

常用相似度计算方法总总结

一、欧几里得相似度 1、欧几里得相似度 公式如下所示: 2、自定义代码实现 import numpy as np def EuclideanDistance(x, y):import numpy as npx np.array(x)y np.array(y)return np.sqrt(np.sum(np.square(x-y)))# 示例数据 # 用户1 的A B C D E商品数据 [3.3…...

【漏洞复现】WordPress Plugin NotificationX 存在sql注入CVE-2024-1698

漏洞描述 WordPress和WordPress plugin都是WordPress基金会的产品。WordPress是一套使用PHP语言开发的博客平台。该平台支持在PHP和MySQL的服务器上架设个人博客网站。WordPress plugin是一个应用插件。 WordPress Plugin NotificationX 存在安全漏洞,该漏洞源于对用户提供的…...

AI新工具(20240322) 免费试用Gemini Pro 1.5;先进的AI软件工程师Devika;人形机器人Apptronik给你打果汁

✨ 1: Gemini Pro 1.5 免费试用Gemini Pro 1.5 Gemini 1.5 Pro是Gemini系列模型的最新版本,是一种计算高效的多模态混合专家(MoE)模型。它能够从数百万个上下文Token中提取和推理细粒度信息,包括多个长文档和数小时的视频、音频…...

鬼灭之刃-激情台词-02(解释来自文心一言)

愤怒吧,不共戴天的仇恨,强悍而纯粹的愤怒,将会化作坚不可摧的原动力,督促你变强 —— 吾峠呼世晴《鬼灭之刃》 愤怒和仇恨是一种强烈的情感,它们可以驱使人们去寻求改变,去变得更加强大。在故事中&#xff…...

openssl3.2 - exp - aes-128-cbc

文章目录 openssl3.2 - exp - aes-128-cbc概述笔记openssl 命令行实现简单直白的实现简单直白的实现 - 测试效果简单直白的实现 - 测试工程 周全灵活的实现周全灵活的实现 - 测试效果周全灵活的实现 - 测试工程 清晰一些的版本END openssl3.2 - exp - aes-128-cbc 概述 想将工…...

脑机新手指南(八):OpenBCI_GUI:从环境搭建到数据可视化(下)

一、数据处理与分析实战 (一)实时滤波与参数调整 基础滤波操作 60Hz 工频滤波:勾选界面右侧 “60Hz” 复选框,可有效抑制电网干扰(适用于北美地区,欧洲用户可调整为 50Hz)。 平滑处理&…...

rknn优化教程(二)

文章目录 1. 前述2. 三方库的封装2.1 xrepo中的库2.2 xrepo之外的库2.2.1 opencv2.2.2 rknnrt2.2.3 spdlog 3. rknn_engine库 1. 前述 OK,开始写第二篇的内容了。这篇博客主要能写一下: 如何给一些三方库按照xmake方式进行封装,供调用如何按…...

【快手拥抱开源】通过快手团队开源的 KwaiCoder-AutoThink-preview 解锁大语言模型的潜力

引言: 在人工智能快速发展的浪潮中,快手Kwaipilot团队推出的 KwaiCoder-AutoThink-preview 具有里程碑意义——这是首个公开的AutoThink大语言模型(LLM)。该模型代表着该领域的重大突破,通过独特方式融合思考与非思考…...

spring:实例工厂方法获取bean

spring处理使用静态工厂方法获取bean实例,也可以通过实例工厂方法获取bean实例。 实例工厂方法步骤如下: 定义实例工厂类(Java代码),定义实例工厂(xml),定义调用实例工厂&#xff…...

Spring Boot+Neo4j知识图谱实战:3步搭建智能关系网络!

一、引言 在数据驱动的背景下,知识图谱凭借其高效的信息组织能力,正逐步成为各行业应用的关键技术。本文聚焦 Spring Boot与Neo4j图数据库的技术结合,探讨知识图谱开发的实现细节,帮助读者掌握该技术栈在实际项目中的落地方法。 …...

土地利用/土地覆盖遥感解译与基于CLUE模型未来变化情景预测;从基础到高级,涵盖ArcGIS数据处理、ENVI遥感解译与CLUE模型情景模拟等

🔍 土地利用/土地覆盖数据是生态、环境和气象等诸多领域模型的关键输入参数。通过遥感影像解译技术,可以精准获取历史或当前任何一个区域的土地利用/土地覆盖情况。这些数据不仅能够用于评估区域生态环境的变化趋势,还能有效评价重大生态工程…...

JVM 内存结构 详解

内存结构 运行时数据区: Java虚拟机在运行Java程序过程中管理的内存区域。 程序计数器: ​ 线程私有,程序控制流的指示器,分支、循环、跳转、异常处理、线程恢复等基础功能都依赖这个计数器完成。 ​ 每个线程都有一个程序计数…...

安宝特案例丨Vuzix AR智能眼镜集成专业软件,助力卢森堡医院药房转型,赢得辉瑞创新奖

在Vuzix M400 AR智能眼镜的助力下,卢森堡罗伯特舒曼医院(the Robert Schuman Hospitals, HRS)凭借在无菌制剂生产流程中引入增强现实技术(AR)创新项目,荣获了2024年6月7日由卢森堡医院药剂师协会&#xff0…...

Java毕业设计:WML信息查询与后端信息发布系统开发

JAVAWML信息查询与后端信息发布系统实现 一、系统概述 本系统基于Java和WML(无线标记语言)技术开发,实现了移动设备上的信息查询与后端信息发布功能。系统采用B/S架构,服务器端使用Java Servlet处理请求,数据库采用MySQL存储信息&#xff0…...

Java数值运算常见陷阱与规避方法

整数除法中的舍入问题 问题现象 当开发者预期进行浮点除法却误用整数除法时,会出现小数部分被截断的情况。典型错误模式如下: void process(int value) {double half = value / 2; // 整数除法导致截断// 使用half变量 }此时...