| | |
| | | export default class Player { |
| | | |
| | | constructor(dom) { |
| | | // init |
| | | this.app = new PIXI.Application({ |
| | | background: '#f1f2f6', |
| | | antialias: true, |
| | | // resizeTo: dom, // 自动调整 canvas 尺寸 |
| | | }) |
| | | this.app.stage.eventMode = 'static'; |
| | | this.app.stage.hitArea = this.app.screen; |
| | |
| | | dom.appendChild(this.app.view); |
| | | |
| | | globalThis.__PIXI_APP__ = this.app; |
| | | // create a new Sprite from an image path |
| | | |
| | | this.mapContainer = generateMapContainer('mapContainer'); |
| | | |
| | | const bunny = PIXI.Sprite.from('https://pixijs.com/assets/bunny.png'); |
| | | |
| | | // center the sprite's anchor point |
| | | bunny.anchor.set(0.5); |
| | | |
| | | // move the sprite to the center of the screen |
| | | bunny.x = this.app.screen.width / 2; |
| | | bunny.y = this.app.screen.height / 2; |
| | | |
| | | this.app.stage.addChild(bunny); |
| | | |
| | | // Listen for animate update |
| | | this.app.ticker.add((delta) => { |
| | | // just for fun, let's rotate mr rabbit a little |
| | | // delta is 1 if running at 100% performance |
| | | // creates frame-independent transformation |
| | | bunny.rotation += 0.1 * delta; |
| | | }); |
| | | } |
| | | |
| | | |
| | | } |
| | | |
| | | const generateMapContainer = (name) => { |
| | | const mapContainer = new PIXI.Container(); |
| | | mapContainer.sortableChildren = true; |
| | | mapContainer.name = name; |
| | | mapContainer.data = {}; |
| | | return mapContainer; |
| | | } |