jdotr

Phaser 3 nine slice plugin!

Recommended Posts

Hey All!

I needed to display some dialog boxes in a recent game and the old 9-slice plugin wasn't ported to v3 yet so I wrote one (github repo). I have a live demo here and a gif of it in use follows. Would love to see this get some use outside of my projects so give it a spin. I'm pretty active on the discord and try to check in here weekly so feel free to ping if you have any questions!

9slice-demo.gif.aec8b2b888294055b8488fa0677c7808.gif

 

Happy hacking!

Share this post


Link to post
Share on other sites
On 6/20/2018 at 8:32 AM, jdotr said:

Hey All!

I needed to display some dialog boxes in a recent game and the old 9-slice plugin wasn't ported to v3 yet so I wrote one (github repo). I have a live demo here and a gif of it in use follows. Would love to see this get some use outside of my projects so give it a spin. I'm pretty active on the discord and try to check in here weekly so feel free to ping if you have any questions!

9slice-demo.gif.aec8b2b888294055b8488fa0677c7808.gif

 

Happy hacking!

@jdotr I am trying to use this plugin in my game. Getting the following error: Uncaught ReferenceError: NineSlicePlugin is not defined. 
My code is look like this.

    <script
  type="text/javascript"
  src="https://github.com/jdotrjs/phaser3-nineslice/releases/download/v0.3.7/nineslice.js"
></script>
var conf = {
  type: Phaser.AUTO,
  width: window.innerWidth,
  height: window.innerHeight,
  backgroundColor: 0x57407c,
  plugins: {
    global: [ NineSlicePlugin.DefaultCfg ],
  },
  scene: [gameScene]
};

game = new Phaser.Game(conf);
let gameScene = new Phaser.Scene('Game');

gameScene.create = function () {

    this.dlg = this.add.nineslice(
        110, 110,   // this is the starting x/y location
        340, 240,   // the width and height of your object
        'dlgLarge', // a key to an already loaded image
        88,         // the width and height to offset for a corner slice
        24          // (optional) pixels to offset when computing the safe usage area
      )
   };

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.