微信小程序 画布canvas

属性说明

属性类型默认值必填说明最低版本
typestring指定 canvas 类型,支持 2d (2.9.0) 和 webgl (2.7.0)2.7.0
canvas-idstringcanvas 组件的唯一标识符,若指定了 type 则无需再指定该属性1.0.0
disable-scrollbooleanfalse当在 canvas 中移动时且有绑定手势事件时,禁止屏幕滚动以及下拉刷新1.0.0
bindtouchstarteventhandle手指触摸动作开始1.0.0
bindtouchmoveeventhandle手指触摸后移动1.0.0
bindtouchendeventhandle手指触摸动作结束1.0.0
bindtouchcanceleventhandle手指触摸动作被打断,如来电提醒,弹窗1.0.0
bindlongtapeventhandle手指长按 500ms 之后触发,触发了长按事件后进行移动不会触发屏幕的滚动1.0.0
binderroreventhandle当发生错误时触发 error 事件,detail = {errMsg}

ug & Tip

  1. tip:canvas 标签默认宽度300px、高度150px
  2. tip:同一页面中的 canvas-id 不可重复,如果使用一个已经出现过的 canvas-id,该 canvas 标签对应的画布将被隐藏并不再正常工作
  3. tip:请注意原生组件使用限制
  4. tip:开发者工具中默认关闭了 GPU 硬件加速,可在开发者工具的设置中开启“硬件加速”提高 WebGL 的渲染性能
  5. tip: WebGL 支持通过 getContext('webgl', { alpha: true }) 获取透明背景的画布
  6. tip: WebGL 暂不支持真机调试,建议使用真机预览
  7. tip: Canvas 2D(新接口)需要显式设置画布宽高,默认:300*150,最大:1365*1365
  8. bug: 避免设置过大的宽高,在安卓下会有crash的问题
  9. tip: iOS 暂不支持 pointer-events
  10. tip: 在 mac 或 windows 小程序下,若当前组件所在的页面或全局开启了 enablePassiveEvent 配置项,该内置组件可能会出现非预期表现(详情参考 enablePassiveEvent 文档)

Canvas 2D 示例代码

 

 

 

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

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

相关文章

【Python】解决Python报错:KeyError: ‘username‘

​​​​ 文章目录 引言1. 错误详解2. 常见的出错场景2.1 用户输入处理错误2.2 动态数据源 3. 解决方案3.1 使用 get() 方法3.2 检查键是否存在 4. 预防措施4.1 数据验证4.2 使用默认字典 (defaultdict) 结语 引言 在Python开发中,处理字典时遇到 KeyError 是一种…

Elastic 8.14:用于简化分析的 Elasticsearch 查询语言 (ES|QL) 正式发布

作者:来自 Elastic Brian Bergholm 今天,我们很高兴地宣布 Elastic 8.14 正式发布。 什么是新的? 8.14 版本最重要的标题是 ES|QL 的正式发布(GA),它是从头开始设计和专门构建的,可大大简化数据调查。在新的查询引擎的…

Mac环境下,简单反编译APK

一、下载jadx包 https://github.com/skylot/jadx/releases/tag/v1.4.7 下载里面的这个:下载后,找个干净的目录解压,我是放在Downloads下面 二、安装及启动 下载和解压 jadx: 下载 jadx-1.4.7.zip 压缩包。将其解压到你希望的目…

【数据结构】排序——插入排序,选择排序

前言 本篇博客我们正式开启数据结构中的排序,说到排序,我们能联想到我之前在C语言博客中的冒泡排序,它是排序中的一种,但实现效率太慢,这篇博客我们介绍两种新排序,并好好深入理解排序 💓 个人主…

HC-SR505人体感应灯

1硬件 1.1硬件组成 1.正点原子探索者开发板 2 HC-SR505迷你小型人体感应模块 3 继电器+5V小灯 HC-SR505迷你小型人体感应模块介绍 1.2 硬件连接 1.HC-SR505(连接在PE0) 2.继电器(连接在PE1) 2.主要代码 int ma…

【nerf】nvidia-smi

当cmd下nvidia -smi不能使用时候 沿着以下路径打开cmd,再输入,可以查看cuda版本 然后查看电脑安装的

【QT5】<总览五> QT多线程、TCP/UDP

文章目录 前言 一、QThread多线程 二、QT中的TCP编程 1. TCP简介 2. 服务端程序编写 3. 客户端程序编写 4. 服务端与客户端测试 三、QT中的UDP编程 1. UDP简介 2. UDP单播与广播程序 前言 承接【QT5】<总览四> QT常见绘图、图表及动画。若存在…

二叉树—leetcode

前言 本篇博客我们来仔细说一下二叉树二叉树的一些OJ题目 请看完上一篇:数据结构-二叉树-CSDN博客 💓 个人主页:普通young man-CSDN博客 ⏩ 文章专栏:LeetCode_普通young man的博客-CSDN博客 若有问题 评论区见📝 &…

Llama模型家族之Stanford NLP ReFT源代码探索 (四)Pyvene论文学习

LlaMA 3 系列博客 基于 LlaMA 3 LangGraph 在windows本地部署大模型 (一) 基于 LlaMA 3 LangGraph 在windows本地部署大模型 (二) 基于 LlaMA 3 LangGraph 在windows本地部署大模型 (三) 基于 LlaMA…

音视频转为文字SuperVoiceToText

音视频转为文字SuperVoiceToText,它能够把视频或语音文件高效地转换为文字,它是基于最为先进的 AI 大模型,通过在海量语音资料上进行训练学习而造就,具备极为卓越的识别准确率。 不仅如此,它支持包括汉语、英语、日语…

Java数据结构准备工作---常用类

文章目录 前言1.包装类1.1.包装类基本知识1.2.包装类的用途1.3.装箱和拆箱1.3.1.装箱:1.3.2.拆箱 1.4 包装类的缓存问题 2.时间处理类2.1.Date 时间类(java.util.Date)2.2.DateFormat 类和 SimpleDateFormat 类2.3.Calendar 日历类 3.其他常用类3.1.Math类3.2.Rando…

Diffusers代码学习: T2I Adapter

T2I Adapter是一款轻量级适配器,用于控制文本到图像模型并为其提供更准确的结构指导。它通过学习文本到图像模型的内部知识与外部控制信号(如边缘检测或深度估计)之间的对齐来工作。 T2I Adapter的设计很简单,条件被传递到四个特征…

前端使用轮播图的方法有哪些

前端使用轮播图的方法可以使用swiper:Swiper中文网-轮播图幻灯片js插件,H5页面前端开发 这是swiper官网,在官网里面可以找到很多轮播图的实际案例: 我们挑选可用的案例或者修改的案例,打开后打开源码,就可以获取到当前的源码了,加以调试就可以获得我们需要的结果, 例如: 上图…

KEIL5如何打开KEIL4的GD工程

GD官方提供的很多KEIL例程为KIEL4的版本,读者使用的时候可能会碰到使用KEIL5打开KEIL4的工程会报错以及无法找到芯片选型的问题,具体表现如下图所示。 我们该怎么办呢? 下面为大家介绍两种方法: 第一种方法是在keil4的工程后缀u…

基于不确定性的相互学习 用于联合医学图像分类和分割

文章目录 Uncertainty-Informed Mutual Learning for Joint Medical Image Classification and Segmentation摘要方法实验结果 Uncertainty-Informed Mutual Learning for Joint Medical Image Classification and Segmentation 摘要 该论文提出了一种基于不确定性的相互学习…

eNSP学习——RIP故障处理

目录 主要命令 原理概述 实验目的 实验内容 实验拓扑 实验编址 实验步骤 1、导入设备预配置 2、排除R1与R2间的故障 3、排除R1与R3间的故障 需要eNSP各种配置命令的点击链接自取:华为eNSP各种设备配置命令大全PDF版_ensp配置命令大全资源-CSDN文库 主要命令 //检查…

SpringBoot集成缓存功能

1. 缓存规范 Java Caching定义了五个核心接口,分别是:CachingProvider、CacheManager、Cache、Entry和Expiry。 CachingProvider:定义了创建、配置、获取、管理和控制多个CacheManager。一个应用可以在运行期访问多个CachingProvider。CacheM…

分治乘法详细讲解

我绝对不会告诉你我是因为太蒻了,不会 FFT 才搞这个的。 我用一下别人的图没什么问题吧 看得懂吧?比如 X 123456 , Y 987654 X123456,Y987654 X123456,Y987654,则 n 3 , A 123 , B 456 , C 987 , D 654 n3,A123,B456,C987,D654 n3…

Web学习_SQL注入_联合查询注入

UNION 操作符用于合并两个或多个 SELECT 语句的结果集, UNION 结果集中的列名总是等于 UNION 中第一个 SELECT 语句 中的列名,并且UNION 内部的 SELECT 语句必须拥有相同数量的 列。 联合查询注入就是利用union操作符,将攻击者希望查询的语句…

jmeter性能优化之mysql监控sql慢查询语句分析

接上次博客:基础配置 多用户登录并退出jmx文件:百度网盘 提取码:0000 一、练习jmeter脚本检测mysql慢查询 随意找一个脚本(多用户登录并退出),并发数设置300、500后分别查看mysql监控平台 启动后查看,主要查看mysql…