pixi-reactive-particles
    TypeScript icon, indicating that this package has built-in type declarations

    0.1.5 • Public • Published

    pixi-reactive-particles

    Integrate support for Particle Effects into the pixi-reactive library. You can find more details on the online documentation

    NPM JavaScript Style Guide

    Install

    npm install pixi-reactive-particles

    or

    yarn add pixi-reactive-particles

    Usage

    import React, { useReducer } from 'react';
    import { PixiCanvas, PixiTilingSprite, PixiSprite } from 'pixi-reactive';
    import { PixiParticles } from 'pixi-reactive-particles';
    import ThrusterConfig from './thruster.json';
    
    const textures = {
      galaxy: './static/assets/galaxy.png',
      stars: './static/assets/slow-stars.png',
      sheet: './static/assets/spritesheet.json'
    };
    
    export const PixiParticlesExample: React.FC = () => {
      const [galaxyPosition, updateGalaxyPosition] = useReducer((position) => position - 1, 0);
    
      return (
        <PixiCanvas height={300} textures={textures} onUpdate={updateGalaxyPosition}>
          <PixiTilingSprite texture={'galaxy'} tileX={galaxyPosition} />
          <PixiSprite texture={'spaceship'} x={100} alignY={0.5}>
            <PixiParticles textures={'particle fire'} config={ThrusterConfig} />
          </PixiSprite>
        </PixiCanvas>
      );
    };

    License

    MIT © mcastiello

    Keywords

    none

    Install

    npm i pixi-reactive-particles

    DownloadsWeekly Downloads

    6

    Version

    0.1.5

    License

    MIT

    Unpacked Size

    22 kB

    Total Files

    12

    Last publish

    Collaborators

    • mcastiello