タグ

2020年1月30日のブックマーク (1件)

  • 【Pixi連載#1】Pixi.jsでcanvas製オリジナルスライダーを作る - Qiita

    Pixi.jsは慣れれば簡単に2Dアニメーションを表現できて最近とても重宝しているライブラリの一つです。 今回はそんなPixi.jsを使って、一風変わったオリジナルのスライダーを作っていきます。 また、Pixi.jsのフィルターやアニメーション部分にはTweenMaxも使用していきます。 今回作るもの(完成版) 今回作るスライダーの完成版です。 スライダーの構造は至って普通のスライダーと変わりはありません。 その上にPixi FilterのDisplacementフィルターをかけて少し画像がグニっとした見た目になるようにしています。また、クリックした時に波紋が広がるような表現になるように、クリックイベント時にShockwaveフィルターをかけています。 完成版ソースは以下 https://github.com/horizun-horizon/pixi-slider/blob/master/

    【Pixi連載#1】Pixi.jsでcanvas製オリジナルスライダーを作る - Qiita