PixiJS 是運作在 WebGL 下的內容產生工具,如果頁面不支援 WebGL,也可自動轉換成在 Canvas 裡運作。
內建各種互動方式,可以使用一套程式碼,分別對手持裝置與PC做不同或是相同的事件監聽。
也內建了遮罩與混和模式效果,視覺與互動上可考慮與一般網頁不一樣的呈現方式。
擴充上也可再加上 WebGL 濾鏡等功能,更多的介紹與實作,就在內文裡了!
官網裡關於文字的範例有兩個: BASICS - Texthttp://pixijs.io/examples/#/basics/text.js DEMOS - T...
本篇介紹的是 PIXI.extras.AnimatedSprite 類別 PIXI.extras.AnimatedSprite 是個會動的 Sprite 類別...
回顧 PixiJS 在建立後會產生的幾個成員: loader renderer stage ticker view 本篇會提到的是 loader,也是...
如果要說我在學習 PixiJS 裡最吃驚的事情 我想應該是 互動物件在沒有設定 interactive = true 時不會被感應 因為太習慣 HTML 裡上層...
很多時候 PixiJS 需要 resize,使用方式相當簡單 window.onresize = function (event){ var w = win...
如之前提到的,由於 PixiJS 不是 HTML DOM 結構,無法使用開發工具調整物件 我常使用的工具是 dat.GUI,是Chrome Experiment...
支援 tint 方法的物件,可透過設定 tint:number 的方式將顏色套在物件上(設定 tint:0xFFFFFF 會移除套色效果) 官方範例 DEMOS...
支援 blendMode 方法的物件,可透過設定 PIXI.BLEND_MODES 的方式將混合模式套在物件上(設定為 PIXI.BLEND_MODES.NOR...
先前兩篇提到 PixiJS 使用素材的方法: 使用圖片素材 AnimatedSprite 類別,將 sprite 圖片當作逐格影片來用 [PixiJS -...
本篇會講在 PixiJS 裡使用 濾鏡 與 Shader方便理解,分做兩個部分: PixiJS 已寫好,可直接使用的濾鏡 手寫 Shader,實際上也是以濾...