rex

The same, I built ui componments composed by round rectangle shape, images, text, etc... I will use DOM elements if 3rd party api only works on DIV, ex. youtube player.

I have some ui componments. Here is a live demo of grid table.

Update: Add text box

HSV color wheel Set tint of sprite

Color wheel is an array of colors created via var colors = Phaser.Display.Color.HSVColorWheel(1, 1); Here is a live demo.

Here , and here is a simple note of phaser3's main loop.

rexRoundRectangle Round-rectangle shape game object. Links Document Sample code minified source code Live demo Round rectangle

Here is a demo of path finding in a hex board (source code) Related documents Board Hexagon grid Path finder Shape (optional)

Package Sizer Layout children game objects. Links Document Sample code Live demo Nested sizer : Create a list by two level sizers. Label A container with a icon, text, and background. Links Document Sample code Textbox A container with a icon, (typing and paging) text, and background. Links Document Sample code Live demo Textbox Dialog A container with a title, content, buttons and background. Links Document Sample code Live demo Yes/No dialog Single choice dialog Pop-up dialog Grid table A container with a grid table, slider, and scroller. Links Document Sample code Live demo Grid table Tabs A container with 4 groups of buttons around a center panel. Links Document Sample code Live demo Tabs-table

It is a template of my board plugins. Links Document Sample code minified source code Live demo Default behavior Drag two blocks to swap them Three or more blocks with the same color will be eliminated TODO: add more callbacks to insert user-defined behaviors.

rexGridAlign Align objects on quadrilateral or hexagon grid. Links Document Sample code minified source code Live demo Hexagon grid : Align objects on hexagon grid. (Hexagon shape) Isometric grid : Align objects on Isometric grid. (Rhombus shape)

Here is a virtual joystick plugin (demo) if you want more.

rexGridTable Viewer of grid table, to manipulate game object of each visible cell. Links Document Sample code minified source code Live demo Simple dragging : Dragging to scroll table. Scroll table by slider bar : Dragging slider bar to scroll table. (Slider plugin) Scroll table by scroller : Dragging slider bar to scroll table. (Scroller plugin) Scroll table by scroller + slider : Dragging slider bar to scroll table. Horizontal grid table : Horizontal table. Varying cell height : Grid table with varying cell height.

Add scroller plugin.

@phaserlover Yes, I also spent half of year to write some notes of phaser3, when I surveyed source code and examples.