背景 当我们开发一个canvas应用的时候,出于效率的考量,免不了要选择一个渲染引擎(比如PixiJS)或者更强大一点的游戏引擎(比如Cocos Creator.Layabox). 渲染引擎通常会有Sprite的概念,一个完整的界面会由很多的Sprite组成,如果编写复杂一点的界面,代码里面会充斥创建精灵.设置精灵位置和样式的"重复代码",最终我们得到了极致的渲染性能却牺牲了代码的可读性. 游戏引擎通常会有配套的IDE,界面通过拖拽即可生成,最终导出场景配置文件,这大大方便了UI开发,…

在上一篇Android:手把手教你打造可缩放移动的ImageView最后提出了一个注意点:当自定义的MatrixImageView如ViewPager.ListView等带有滑动效果的ViewGroup中时,ImageView自定义的拖动事件会和ViewGroup的滑动事件冲突,并且指出了冲突原因是由于ViewGroup拦截了Move事件的缘故.如果对于Touch事件的分发机制不甚了解的话,可以参考下这篇Android:30分钟弄明白Touch事件分发机制. 这篇文章将会在MatrixImage…

手把手教你使用 js 实现一个 Canvas 编辑器 拖拽 缩放,等比缩放 导出 image 模版 撤销,重做 OOP,封装,继承,多态 发布库 CI/CD (gitlab/github) ... https://caniuse.com/?search=canvas Canvas API toDataURL() https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL refs https://ove…

Cax 小程序.小游戏以及 Web 通用 Canvas 渲染引擎 Github → https://github.com/dntzhang/cax 点我看看 DEMO 小程序 DEMO 正在审核中敬请期待 小游戏 DEMO 正在审核中敬请期待 特性 Learn Once, Write Anywhere(小程序.小游戏.PC Web.Mobile Web) 支持小程序.小游戏以及 Web 浏览器渲染 小程序.小游戏和 Web 拥有相同简洁轻巧的 API 高性能的渲染架构 超轻量级的代码体积 松耦合…

Kubernetes 作为云原生时代的操作系统,熟悉和使用它是每名用户的必备技能.本文将介绍一些提高操作 Kubernetes 效率的技巧以及如何打造一个高效的 Kubernetes 命令行终端的方法. Kubectl 自动补全 Kubectl 这个命令行工具非常重要,与之相关的命令也很多.我们也记不住那么多的命令,而且也会经常写错,所以命令行自动补全是很有必要的.Kubectl 工具本身就支持自动补全,只需简单设置一下即可. Bash 用户 大多数用户的 Shell 使用的是 Bash,Lin…

大家好,看我像不像蘑菇-因为我在学校呆的发霉了. 思而不学则殆 丽丽说得对,我有奇怪的疑问,大都是思而不学造成的,在我书读不够的情况下想太多,大多等于白想,所以革命没成功,同志仍需努力. 好了废话不说了,由于布总要做一个心电图的玩意,所以做来练练手,总之拿到的UI图如下: 做好的效果如下: 拿到图,先做一些简单的分析.呃.. 背景表格的绘制 心电图的绘制 背景表格的绘制: 首先drawColor黑色,然后用循环来画线. 心电图的绘制: 看样子是path,应该没问题. 于是就大干一番,按照这俩步骤…

来,干了这碗安利 写这篇文章的目的其实就是为了安利一下我的图标库:iconoo,所以,开门见山,star吧少年少妇们!(这样的我是不是应该要加个github互粉的团伙了?) 主题说完了,下面进入正题. 在web开发中,我们经常要用到一些小图标(加减勾叉等).通常做法就两种: 直接使用图片: 使用css/svg直接在浏览器中绘制图标. 方案1:由于图标图片比较多,而且体积很小,为了减少请求所以很多时候我们会用雪碧图这种技术来将图标拼凑在同一张图片里面.你也能想到,一堆图标的雪碧图,修改维护会相当麻…

项目需求:做一个图片浏览器,点击图片查看大图,大图模式下,左右滚动能查看不同的图片. 项目的主要核心技术:图片的弹出和消失动画     项目源代码: Photo-Browser   一.对代码进行重构 1.对代码进行抽取划分      1.1 为什么要对代码进行抽取?           swift中,代码全部写在一起,阅读性极差       2.如何对代码进行抽取?      2.1在oc中,可以把功能模块抽取一个个方法        2.2swift中,专门提供 extension ,可以对…

本文章将讲解基于TCP连接的Socket通讯,使用Socket异步功能,并且无粘包现象,通过事件驱动使用. 在编写Socket代码之前,我们得要定义一下Socket的基本功能. 作为一个TCP连接,不论是客户端还是服务器端,它都得有以下接口: public interface ISocket { /// <summary> /// 获取是否已连接. /// </summary> bool IsConnected { get; } /// <summary> /// 发送…

定义ImageView,实现功能如下: 1.初始化时图片垂直居中显示,拉伸图片宽度至ImageView宽度. 2.使用两根手指放大缩小图片,可设置最大放大倍数,当图片小于ImageView宽度时,在手指离开屏幕时恢复到ImageView宽度. 3.支持双击放大缩小.当图片处于未放大状态时,双击放大至指定倍数,当图片处于放大状态时,双击恢复至未放大状态. 4.图片拖动效果.当图片处于未放大状态时,不可拖动. 5.图片拖动效果.当放大后的高度不超过ImageView时,不可垂直拖动.(由于默认设置拉…