小程序Canvas隐藏问题处理

天马3798

于 2018-06-10 10:11:45 发布

阅读量1.9w

点赞数 5

分类专栏： JavaScript 文章标签：小程序Canvas隐藏问题处理

本文链接：https://blog.csdn.net/u011127019/article/details/80638771

版权

JavaScript 专栏收录该内容

56 篇文章 9 订阅 ¥9.90 ¥99.00

订阅专栏

超级会员免费看

当前版本的小程序中，Canvas的隐藏存在一些问题，直接使用display：none无法隐藏，会导致绘制的内容仍然显示在页面最上层。一种解决方法是在Canvas上层添加一个可隐藏的view。此外，内容还涉及C#的微信AES-128-CBC解密及JavaScript的进制转换和动态添加对象属性。

摘要由CSDN通过智能技术生成

一、目前版本小程序框架

当前问题参考处理建议使用这种方式：https://my.oschina.net/tianma3798/blog/2051575

canvas使用方面还有些不足地方。

比如：canvas 的直接隐藏目前不可用 display：none

只要使用上线文draw绘制就会显示在页面最上层，遮盖其他内容。

当前问题解决方案1：

在page的直接子节点添加一层view，将view设置隐藏就可以了。

<view style='width:0px;height:0px;overflow:hidden;'>
  <canvas canvas-id='canone'></canvas>
</view>

绘制代码，照常起作用

  //绘制命令
  drawOne: function () {
    var url = 'http://www.jnqianle.cn/upload/logo/content/2

了解本专栏

订阅专栏解锁全文

超级会员免费看

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

天马3798

关注关注

5
点赞
踩
5

收藏

觉得还不错? 一键收藏
10
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

订阅专栏

10 条评论您还未登录，请先登录后发表或查看评论

博客

Cordova 插件合集_cordova-plugin合集

04-05

5749

1.0cordova-plugin-contacts 联系人，新增，联系人，拨打电话cordova plugin add cordova-plugin-contacts详细：cordova-plugin-contacts联系人操作_天马3798的博客-CSDN博客_cordova 联系人1.cordova-plugin-themeablebrowsercordova plugin add cordova-plugin-themeablebrowser详细使用：cordova-p...

博客

C# 开发教程-中级教程

09-14

690

2.C# 进程处理、进程交互。

博客

Android 开发入门教程-入门基础

09-14

516

4. Android Adb 调试工具。3.Android Avd 虚拟机。

博客

Apache Cordova开发教程-入门基础

09-14

647

2.Apache Cordova CLI环境搭建，编译，启动。3.Apache Cordova Android环境搭建。5.Apache Cordova +Vue 开发搭建。4.Apache Cordova 插件安装和使用。1.Apache Cordova 简介。

博客

C# 开发教程-入门基础

09-14

483

2.C# 基本语法，变量，控制局域，数据类型，类型转换。6.C# 面相对象，继承，封装，多态。7.C# 特性、属性、反射、索引器。3.C# 数组、循环，Linq。1.C# 简介、环境，程序结构。8.C#委托，事件，集合，泛型。4.C# 类，封装，方法。5.C# 枚举、字符串。

博客

维信小程序禁止截屏/录屏

09-02

1681

监听用户主动截屏事件。用户使用系统截屏按键截屏时触发，只能注册一个监听。设置是否保持常亮状态。仅在当前小程序生效，离开小程序后设置失效。用户录屏，录制的是空白内容/黑色内容的视频。查询用户是否在录屏。

博客

高德地图JS API地址解析

07-24

243

1. 登陆高德地图开放平台》控制台，申请key + 秘钥。特别说明当前使用的事 js 2.0版本，一定要配置秘钥。2.引入高德地图js库。

博客

微信小程序canvas 使用案例（一）

07-20

626

微信小程序canvas 使用案例，cavans 对象获取、上线文创建

博客

微信小程序数组绑定使用案例（二）

07-20

745

/微信小程序 data 数据单项绑定，setData方法修改属性并且渲染页面展示。// this.data.name='李四';'name': '李四'//方案2,根据路径修改变量。3.css 代码忽略。

博客

微信小程序数组绑定使用案例（一）

07-20

588

重点解读：可以使用js对象路径方式，修改变量并重新绘制页面。微信小程序数组绑定案例，修改数组中的值。

博客

js 数据类型详解

07-06

445

总结:想要转整数用parseInt()，想要转小数用parseFloat()，想要转数字:Number();字符串之间用 '+' 会拼接字符串，如果其他类型数据和字符串拼接，会被转换为字符串，这其中涉及到变量的隐式转换。NaN 不是一个数字，或者不是数字与数字的计算就会得到 NaN (isNaN() 判断一个值是不是 NaN)可以声明全局或局部作用域的变量。3. const：用于声明块级作用域的只读变量，即其值被设置后无法更改。用于声明块级作用域的变量，即在一对花括号{}内有效。

博客

JS 四舍五入使用整理

07-06

696

一、Number.toFixed()把数字转换为字符串，结果的小数点后有指定位数的数字,重点返回的数据类型为字符串toFixed() 方法将一个浮点数转换为指定小数位数的字符串表示，如果小数位数高于数字，则使用 0 来填充。toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。注意：toFixed() 方法在进行四舍五入时可能会产生一些不准确的结果，这是因为 toFixed() 方法在处理浮点数时，实际上使用的是舍入到最近的偶数（银行家舍入）策略，而不是标准的四舍五入。这种舍入策略是为了

博客

JQuery Ajax教程_Ajax服务器交互

06-22

1073

通过 jQuery AJAX 方法，您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素中。上传文件时使用的编码格式, 提交的数据从request.POST中提取, 上传的文件从request.FILES中提取。ajax发送的json格式数据, 在request.POST中取不到数据, 需要在request.body中提取数据。默认的编码格式, 提交的数据从request.POST中提取。

博客

JQuery 概念、历史、发展、优势-JQuery开发教程

06-22

859

jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（框架）于2006年1月由John Resig发布。它推动了JavaScript在浏览器端的应用，为开发者提供了便利和效率，成为了Web开发中不可或缺的一部分。版本3.x系列：2016年发布的jQuery 3.x系列进一步改进了性能和稳定性，并增加了一些新特性。社区和生态系统：除了核心库之外，jQuery还拥有丰富的插件和扩展，这些由社区贡献的内容为开发者提供了更多的选择和功能。

博客

JQuery 开发教程入门基础

06-22

383

五、JQuery HTML Dom操作、表单操作。八、JQuery 插件封装（可以放高级教程中）二、JQuery 开发环境搭建、运行、调试。三、JQuery 语法、遍历、数据、选择器。一、JQuery 概念、历史、发展、优势。四、JQuery Ajax 服务器交互。六、JQuery 动画效果操作。七、JQuery 事件绑定。

博客

Cordova WebView重定向到网站

06-10

490

即可实现重定向指定的网站页面。

博客

cordova-plugin-inappbrowser内置浏览器插件

06-10

723

允许在在单独的窗口中加载网页。例如要向应用用户展示其他网页。当然可以很容易地在应用中加载网页内容并管理，但有时候需要不同的用户体验，InAppBrowser加载网页内容，应用用户可以更方便的直接返回到主应用。1.直接使用：隐藏地址栏，全部或者全屏显示2.重写window.open（）支持打开1. URL参数为浏览器跳转的地址；2. target的参数有三种：_self：如果URL地址在WhiteList中，则用Cordova的WhiteList将其打开；_blank：直接在App中将其地址打开；

博客

input组件 type为nickname pc端获取不到这个绑定的值？

06-07

688

开发者工具可以获取，Android 手机端可以获取，苹果手机端可以获取。在pc端使用input blur 事件获取选择昵称结果失败。PC端不少的版本框架目前，获取不到选择的头像；使用微信小程序form表单方式，获取选择的昵称。pc端真机调试，打印没有内容。

博客

HTML网页滚动条使用整理_网页滚动条使用详解

06-01

782

HTML Document 滚动条，自动出现；当网页内容超出浏览器可视宽度或者高度，滚动条自动出现；不同浏览器滚动条样式效果不同。1.js绑定2.jquery 绑定3.js滚动条监听：滚动条事件，操作滚动条滚动。

博客

C# GDI+ 字体使用 Font

05-18

741

GDI+中将具有相同的样式成为字体系列，如我们常见的 “宋体”、“仿宋” 、“微软雅黑”、 “Arial”等。FontStyle 枚举列出了常见的字体风格，其定义如下。计算机字体表示组层：字体集、大小，规格，单位。字体库/字体集：FontFamily。字体单位：GraphicsUnit。字体规格：FontStyle。