Skip to content

Latest commit

 

History

History
90 lines (61 loc) · 1.56 KB

README.md

File metadata and controls

90 lines (61 loc) · 1.56 KB

Glixy

glixy is a Svelte library with delightful (and leaky :P) abstraction for building PixiJS applications with ease.

Live demo

Installation

To install the package:

pnpm i glixy

Usage

Stage

The Stage component sets up the WebGL stage.

<script lang="ts">
	import { Stage } from 'glixy';
</script>

<Stage>
	<!-- Your WebGL content here -->
</Stage>

Container

The Container component is used to group and position other WebGL elements.

<script lang="ts">
	import { Container } from 'glixy';
</script>

<Container x={100} y={100}>
	<!-- Your WebGL elements here -->
</Container>

Sprite

The Sprite component is used to render images in the WebGL context.

<script lang="ts">
	import { Sprite } from 'glixy';
</script>

<Sprite
	texture="https://pixijs.com/assets/bunny.png"
	x={150}
	y={150}
	scale={{ x: 1, y: 1 }}
	rotation={0}
/>

Components

Stage

  • Under the hood it's using PixiJS Application, See API

Container

  • props:
    • x: X position of the container.
    • y: Y position of the container.

Sprite

  • props:
    • texture: URL of the image to be used as the texture.
    • x: X position of the sprite.
    • y: Y position of the sprite.
    • scale: Scale of the sprite.
    • rotation: Rotation of the sprite.

Contributing

Contributions are welcome! Please open an issue or submit a pull request on GitHub.

License

This project is licensed under the MIT License.