鸿蒙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层的原理
  • 各种开发调试工具
  • 智能设备开发
  • 分布式开发等等。

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

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

混合云构建-使用 Azure ExpressRoute 建立从本地到 Azure 虚拟网络的专用连接

如果有大量业务数据需要在本地数据中心和azure私有网络进行传输,同时保证带宽和时延的情况需要使用 ExpressRoute 设置从本地网络到 Azure 中的虚拟网络的专用连接。以下是实操步骤供参考: 一、创建和预配 ExpressRoute 线路 登录 Azure 门户。 在页面…

为什么独享ip会更高效?

随着互联网的蓬勃发展,代理IP因其特性,也备受关注,代理IP又有分共享代理IP和独享代理IP,但,无论是在数据采集方面,还是在其他业务场景上,独享代理IP似乎会更受用户欢迎一点,这到底是…

【Flask】Flask数据迁移操作

Flask数据迁移操作 前提条件 安装第三方包: # ORM pip install flask-sqlalchemy # 数据迁移 pip install flask-migrate # MySQL驱动 pip install pymysql # 安装失败,指定如下镜像源即可 # pip install flask-sqlalchemy https://pypi.tuna.tsinghu…

Typecho如何去掉/隐藏index.php

Typecho后台设置永久链接后,会在域名后加上index.php,很多人都接受不了。例如如下网址:https://www.jichun29.cn/index.php/archives/37/,但我们希望最终的形式是这样:https://www.jichun29.cn/archives/37.html。那么…

Lua热更新(Lua)

-- [[]] print 下载Lua For Windows Sublime Text(仅用于演示,实际项目使用VsCode) CtrlB运行 语法基础 基础类型:nil number string boolean 运算符:and-or-not ~ ^ if-then-end-elseif-else while-do-…

Kotlin零基础入门到进阶实战

教程介绍 Kotlin现在是Google官方认定Android一级开发语言,与Java100%互通,并具备诸多Java尚不支持的新特性,每个Android程序员必备的Kotlin课程,每个Java程序员都需要了解的Kotlin,掌握kotlin可以开发Web前端、Web后…

【机器学习300问】46、什么是ROC曲线?

一、二分类器的常用评估指标有哪些? 二分类器是机器学习领域中最常见的也是应用最广泛的分类器。评价二分类器的指标也很多,下面列出几个我之前重点写文章介绍过的指标。 (1)准确率(Accuracy) 定义为分类正…

VSGitHub项目联动(上传和克隆),创建你的第一个仓库,小白配置

目录: 前言一,基本说明1.1名词概念1.2必配条件 二,配置方法2.1本地生成密钥2.2云端代码托管平台SSH配置添加(GitHub)2.3VS项目配置 三,参考四,一些讨论 前言 🌈在编写VS代码项目时&a…

详细安装步骤:vue.js 三种方式安装(vue-cli)

Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。它不仅易于上手,还便于与第三方库或既有项目整合。 三种 Vue.js 的安装方法&…

Git Commit 提交规范,变更日志、版本发布自动化和 Emoji 提交标准

前言 Git Commit 是开发的日常操作, 一个优秀的 Commit Message 不仅有助于他人 Review, 还可以有效的输出 CHANGELOG, 对项目的管理实际至关重要, 但是实际工作中却常常被大家忽略,希望通过本文,能够帮助大家规范 Git Commit,并且展示相关 …

03_Mybatis

文章目录 入门案例JDBCMybatis MybatisMybatis介绍Mybatis的环境搭建动态代理增删改查示例事务 Mybatis的配置propertiessettingstypeAliasesenvironmentsmappers 输入映射一个参数多个参数按位置传值对象传值使用Map进行传值 #{}和${}的区别输出映射一个参数多个参数单个对象多…

笔记1-Hadoop之HDFS

Hadoop 开源版本的HADOOP和其他框架的对应关系很混乱,要注意。 Hadoop四大模块:Common HDFS MapReduce Yarn Hadoop能对大量的数据进行分布式处理,可以轻松的从一台服务器扩展到千台服务器,并且 每一台服务器都能进行本地计算和…

Flutter开发进阶之瞧瞧BuildOwner

Flutter开发进阶之瞧瞧BuildOwner 上回说到关于Element Tree的构建还缺最后一块拼图,build的重要过程中会调用_element!.markNeedsBuild();,而markNeedsBuild会调用owner!.scheduleBuildFor(this);。 在Flutter框架中,BuildOwner负责管理构建…

【ai技术】(4):在树莓派上,使用qwen0.5b大模型+chatgptweb,搭建本地大模型聊天环境,速度飞快,非常不错!

1,视频地址 https://www.bilibili.com/video/BV1VK421i7CZ/ 2,下载镜像 raspberry-pi-os-64-bit https://blog.csdn.net/freewebsys/article/details/136921703 项目地址: https://www.raspberrypi.com/software/operating-systems/#rasp…

【JAVA重要知识 | 第九篇】ConCurrentHashMap源码分析

文章目录 9.ConCurrentHashMap源码分析9.1 ConCurrentHashMap 1.79.1.1存储结构9.1.2初始化9.1.3put流程(1)判断是否要put(key,value)流程(2)put(key,value)(3)自旋获取hash位置的HashEntry 9.1.4 rehash扩…

【力扣hot100】1. 两数之和 49.字母异位词分组 128. 最长连续序列

目录 1. 两数之和题目描述做题思路参考代码 49.字母异位词分组题目描述做题思路参考代码 128. 最长连续序列题目描述做题思路参考代码 1. 两数之和 题目描述 给定一个整数数组 nums 和一个整数目标值 target,请你在该数组中找出 和为目标值 target 的那 两个 整数…

子网掩码,网段,网关

IP地址、子网掩码、网段、网关【网络常识 2】_哔哩哔哩_bilibili 网关: 什么时候需要用到网关: 若目标IP在同一网段则可以直接通信不需要经过网关,否则需要。 怎么判断对方的ip是否与我在同一网段呢? 判断网络号是否相同。 电…

Android Studio 和 lombok 的版本适配、gradle依赖配置、插件安装及使用

文章目录 Intro注意事项Android Studio 和 lombok 的版本选择及下载下载链接 在 Android Studio 中安装一次 lombok 插件在每个 gradle 项目中添加 lombok 相关依赖(如要用到)使用ref Intro 用惯了 JavaMavenIDEA 开发后端服务,突然有一天用 JavaGradleAndroidStud…

【Flink】窗口实战:TUMBLE、HOP、SESSION

窗口实战:TUMBLE、HOP、SESSION 1.TUMBLE WINDOW1.1 语法1.2 标识函数1.3 模拟用例 2.HOP WINDOW2.1 语法2.2 标识函数2.3 模拟用例 3.SESSION WINDOW3.1 语法3.2 标识函数3.3 模拟用例 4.更多说明 在流式计算中,流通常是无穷无尽的,我们无法…

【PyQt】17.1-日历控件 不同风格的日期和时间、以及高级操作

日历控件puls版本 前言一、日历控件中不同风格的日期和时间1.1 代码1.2 注意事项格式设置m的大小写问题QTime和QDateTime的区别 1.3 运行结果 二、高级操作2.1 成倍调整2.2 下拉出日历2.3 事件函数2.4 获取设置的日期和时间 完整代码 前言 1、不同风格的日期和时间展示 2、高级…