https://github.com/flowforfrank/phaser-ui

🔘 UI Toolkit for Phaser 3
https://github.com/flowforfrank/phaser-ui

javascript javascript-library phaser3 toolkit ui ui-components ui-kit

Last synced: 27 days ago
JSON representation

🔘 UI Toolkit for Phaser 3

• Host: GitHub
• URL: https://github.com/flowforfrank/phaser-ui
• Owner: flowforfrank
• Created: 2021-01-03T21:20:43.000Z (almost 4 years ago)
• Default Branch: master
• Last Pushed: 2021-01-15T11:13:09.000Z (almost 4 years ago)
• Last Synced: 2024-09-28T14:02:37.413Z (about 1 month ago)
• Topics: javascript, javascript-library, phaser3, toolkit, ui, ui-components, ui-kit
• Language: JavaScript
• Homepage: https://webtips.dev
• Size: 399 KB
• Stars: 0
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


    



A UI library for the [Phaser](https://phaser.io/) game framework.

## 🏃‍♂️ Getting Started

After running the following command:

- `npm i phaser-uikit`

You can import all available modules to your project with:

```javascript

import * as UI from 'phaser-uikit'

```

Or just the ones you need:

```javascript

import { Button, Layout } from 'phaser-uikit'

```

## Components

Currently, the following components are supported:

| Component | Description |

| --------- | ----------- |

| [Button](docs/examples/button.md)     | Trigger a user action |

| [Checkbox](docs/examples/checkbox.md) | Toggle a state on and off, or toggle multiple values from several options |

| [Radio](docs/examples/radio.md)       | Select a single value from several options |

| [Layout](docs/examples/layout.md)     | Order multiple elements into a layout |

## 🚀 How to Start the Project Locally

Run the following commands, to start the project locally and play around with some demo components:

- `git clone https://github.com/flowforfrank/phaser-ui.git`

- `npm i`

- `npm run start`

## 🏗️ How to Build the Project Locally

Run `npm run build`. This will create a `dist` folder with a minified version of all the available components.

## 📚 Further Documentation

You can find documentation about the API and examples for all available components in the [docs](/docs/examples).