Skip to content

Commit

Permalink
Updated README
Browse files Browse the repository at this point in the history
  • Loading branch information
neki-dev committed Oct 27, 2023
1 parent 9a720d4 commit 85631c0
Show file tree
Hide file tree
Showing 3 changed files with 32 additions and 13 deletions.
37 changes: 27 additions & 10 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -62,11 +62,11 @@ useGame(): Phaser.Game
#### Get scene
* Get scene in which interface was created
```ts
useCurrentScene(): Phaser.Game
useCurrentScene(): Phaser.Scene
```
* Get scene by key
```ts
useScene(key: string): Phaser.Game
useScene(key: string): Phaser.Scene
```

#### Subscribe to scene update
Expand All @@ -90,9 +90,9 @@ useEvent(

#### Position relative to camera
```ts
useRelativePosition(position: {
x: number,
y: number
useRelativePosition(params: {
x: number,
y: number,
camera?: Phaser.Cameras.Scene2D.Camera
}): React.MutableRefObject<HTMLElement>
```
Expand Down Expand Up @@ -156,14 +156,23 @@ useInteraction(

#### Position relative to camera
```ts
<RelativePosition x={number} y={number} camera={Phaser.Cameras.Scene2D.Camera?}>
<RelativePosition
x={number}
y={number}
camera={Phaser.Cameras.Scene2D.Camera?}
>
...
</RelativePosition>
```

#### Scale relative to canvas size
```ts
<RelativeScale target={number} min={number?} max={number?} round={boolean?}>
<RelativeScale
target={number}
min={number?}
max={number?}
round={boolean?}
>
...
</RelativeScale>
```
Expand Down Expand Up @@ -208,17 +217,25 @@ const Component: React.FC = () => {

#### Create interface component
```ts
import { useScene, useSceneUpdate } from 'phaser-react-ui';
import { useScene, useSceneUpdate, useEvent } from 'phaser-react-ui';

const PlayerHealth: React.FC = () => {
const world = useScene('world');

const [health, setHealth] = useState(0);
const [isAlive, setAlive] = useState(true);

useSceneUpdate(world, () => {
setHealth(world.player.health);
if (isAlive) {
setHealth(world.player.health);
}
}, [isAlive]);

useEvent(world.player, Phaser.GameObjects.Events.DESTROY, () => {
setAlive(false);
}, []);

return (
return isAlive && (
<div className='info'>
{health} HP
</div>
Expand Down
4 changes: 2 additions & 2 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 3 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,12 +1,14 @@
{
"name": "phaser-react-ui",
"description": "React interface render for Phaser engine",
"version": "1.14.1",
"version": "1.14.2",
"keywords": [
"phaser",
"interface",
"react",
"ui",
"library",
"render",
"plugin"
],
"license": "MIT",
Expand Down

0 comments on commit 85631c0

Please sign in to comment.