как загрузить изображение в пакет @ ion-phaser / реаги npm - PullRequest
Новая
       7

как загрузить изображение в пакет @ ion-phaser / реаги npm

1 голос
/ 04 марта 2020 
/**
 * @flow
 */

import React, { Component } from 'react'
import Phaser from 'phaser'
import { IonPhaser } from '@ion-phaser/react'
import logo from './assets/logo.png'
import sky from './assets/sky.png'
import star from './assets/star.png'
import platformPic from './assets/platform.png'
import dude from './assets/dude.png'
import bomb from './assets/bomb.png'

import './App.css'


class App extends Component {

state = {
    unmounted: false,
    initialize: false,
    game: {
        width: "800",
        height: "600",
        type: Phaser.AUTO,
        physics:{
            default: 'arcade', 
            arcade: {
                gravity: {y: 200}, 
                debug: false
            }, 
        }, 
        scene: {
        init: function() {
            // this.cameras.main.setBackgroundColor('#24252A')
        },
          preload: function() {
            this.load.image('sky', '/assets/sky.png');

          },
          create: function() { 
              let platforms;
              this.add.image(400, 300, 'sky').setOrigin(0.5);
          },
          update: function(){

          },
        }
    },
}


initializeGame = () => {
  this.setState({ initialize: true })
}



render() {
const { initialize, game, unmounted } = this.state
return (
    <div>

       { !initialize &&
        <React.Fragment>
          <img src={logo} className="App-logo" alt="logo" />
          <div onClick={this.initializeGame} className="flex">
            <a href="#1" className="bttn">Initialize</a>
          </div>
        </React.Fragment>
      }
      { !unmounted && <IonPhaser game={game} initialize={initialize} /> 
}


    </div>
);
}
}
export default App;

Я получил еще один пример работы с фазером, работающий для примера на ион-фазерах, пример страницы github с реактором и электроном. Я думаю, что он работает быстрее в электронном, чем в браузере.

код загрузки изображения выше не работает, он показывает зеленые прямоугольники с диагностикой вместо изображения. пытаясь завершить учебник для начинающих на веб-странице Phaser 3, преобразовав его в работу с ion-phaser в реакции. Пожалуйста помоги!

...