图片的异步加载 雪碧图 批量资源预加载进度 图片的异步加载 spritejs支持图片URL作为资源，我们前面已经看过，我们可以把URL作为texture直接传给Sprite的texture 属性。但是，因为网络图片资源是异步加载的，这会可能导致sprite的异步显示以及我们拿到的sprite的contentSize为0。 const { S...

Chrome Devtools扩展 Chrome Devtools扩展 spritejs v2.0提供chrome开发者工具扩展，让使用者能够比较方便地在chrome浏览器调试sprite元素。 该扩展工具的正式版还未发布，可以在此处 获取开发版。 安装了开发者工具后，打开devtools，在Elements面板的Sidebar列表里会多出一...

事件 事件 Scene 自动代理了 mouse 和 touch 相关事件，因此要监听这些事件非常简单，直接使用 spirte.addEventListener 方法即可。 const { Scene , Sprite , Label , Path } = spritejs ; const container = do...

提升性能 改变缓冲区大小 组拓印（seal） 云 Cloud 提升性能 在SpriteJSNext中，由于默认对支持WebGL的环境优先使用WebGL渲染，所以性能与旧版的SpriteJS相比有明显的优势。 但是，需要注意的是，采用WebGL渲染并不意味着总是比Canvas2D要好，因为直接用Canvas2D在内存消耗方面要少一些，所以在某些...

继承元素类型 注册元素类型 继承元素类型 我们可以继承Sprite、Label、Path等元素创建我们自己的精灵类型。 const { Scene , Label } = spritejs ; const container = document . getElementById ( 'adaptive' ); con...

append() appendChild() clear() children insertBefore() isVirtual removeChild() scrollBy() scrollTo() SpriteJS支持将元素分组，方法是创建一个group对象，然后将元素添加到group里。 Group可以嵌套。 关于Group的详...

过渡 Transition 动画 Animate 阴影 shadow 滤镜 filter 渐变 gradient 过渡 Transition 如果我们要给元素增加一些简单的效果，可以通过transition来完成，只要在设置和改变元素的属性前调用transition方法，传入时间和可选的easing参数即可。transition的easing...

DOM Events stopDispatch Build-in Events user delegate Custom Events Remove Events SpriteJS支持给精灵派发事件（dispatchEvent），支持DOM事件、内建事件和自定义事件。 DOM Events SpriteJS默认代理了container上的...

绘图尺寸 绘图尺寸 在 SpriteJS Next 中，绘图区域由Scene的width 和height 属性决定。 width 和height 属性影响Canvas的宽高，但是和视口（Viewport）的宽高不一定相同。默认情况下，视口由Scene的容器决定，或者也可以通过CSS样式控制。 const container = docume...

自定义元素 定义属性特殊操作 插件封装 自定义元素 实际上我们在前面一些例子里已经看到过，我们能够继承Sprite一系列类来扩展新的精灵类型。很多例子里我们创建了一些简单的精灵类型。现在我们尝试创建一类更复杂的UI元素。 我们可以很容易制作一组进度条UI组件，在这里我简单写了一个可以有三种展现类型的ProgressBar类（当然也可以将它拆...