1.0.0-alpha2 • Published 4 years ago
nativescript-phaser v1.0.0-alpha2
nativescript-phaser
Tools for using Phaser3 to build native 2D games in NativeScript 👾👾
Installation
npm i nativescript-phaserUsage
Import the library into your JavaScript file:
import TNSPhaser from "nativescript-phaser";Functions
TNSPhaser.game({ canvas, renderer: Phaser.WEBGL || Phaser.CANVAS, ...extras })
Given a canvas from a
TNSCanvas, return a
Phaser.Game
that draws into it.
Props
| Property | Type | Description | Default Value |
|---|---|---|---|
| canvas | TNSCanvas | Required: canvas that the Phaser.Game will render to | null |
| renderer | number? | Optional: choose the renderer type e.g Phaser.CANVAS (1) , Phaser.WEBGL(2) | 1 |
| width | number? | Optional: height of the Phaser.Game | canvas height |
| height | number? | Optional: width of the Phaser.Game | canvas width |
| title | string? | Optional: title of the Phaser.Game | "tns-phaser-game" |
| preventLoop | boolean? | Optional: Prevents the app from calling canvas.nativeView.flush() every frame | false |
Returns
| Property | Type | Description |
|---|---|---|
| game | Phaser.Game | The Phaser3 game used for rendering game logic |
Example
const game = TNSPhaser.game({ canvas });What does it do?
Under the hood, TNSPhaser is maintaining global instances of a few libraries.
window.Phaser = require("phaser");Finally when a new instance of TNSPhaser.Game is created, we set the document.readyState to 'complete' and save the global instance of context
global.__context = context;
global.document.readyState = "complete";Then we create a standard render loop and call canvas.nativeView.flush() to flush the frame queue and render our context.
const render = () => {
requestAnimationFrame(render);
canvas.nativeView.flush();
};License
Apache License Version 2.0, January 2004