2017-02-03 11 views
0

私は自分のキャラクターをドレスアップするPixiJSアプリケーションに取り組んでいます。 異なるPNG画像がPixiステージに読み込まれます。読み込んだPixiキャンバス画像

ドレス文字を終了するボタンがあり、.toDataURL()メソッドを使用して現在のキャンバスを保存します。

問題はユーザーがクリックするとTシャツなどの変更ができ、Tシャツが変更されている間に完了ボタンをクリックできますが、Tシャツが完全に装着されていないとTシャツなしのキャンバスは保存されません。

ドレッシング機能が終了すると、すでにJSコールバックを作成してロックを解除しています。

javascriptコードが正常に完了し、キャンバスイメージを置き換えますが、イメージは読み込むには数秒/ミリ秒(インターネット速度に依存)が必要です。

この間、ユーザーが[完了]ボタンをクリックすると、不完全なキャンバスが表示されることがあります。

キャンバスイメージが完全に読み込まれたことを検出できる方法はありますか?

多くの方に感謝します!

ヨシップ

答えて

2

は、あなただけのイメージローダを使用してPNG画像がキャンバスに画像を挿入する前に、ブラウザによって、ロードされていることを確認する必要があります。したがって、これを使用してください:http://pixijs.download/release/docs/PIXI.loaders.Loader.html

+0

ありがとうHachi for Your answer。ローダーを作成した後、loader.load()を使用してイメージを追加しようとしましたが、loader.once( 'complete'、unlockFinishButton)を呼び出して終了ボタンのロックを解除しましたか?私のイメージがブラウザによってロードされる前にunlockFinishButtonが完了します。おそらく私はあなたもよくローダーを理解していませんでした。 ? – NavCore

+0

遅くなって申し訳ありません。ローダーは、html image要素を使用してリソースをロードします。ローダーが終了したら、ブラウザーはそれらをロードしました。少なくとも私はそこに起こりうる問題を本当に見ていない。 plunkr(https://plnkr.co)やjsfiddleで小さなスクリプトを私に提供できますか?そこにチェックしてデバッグしようと思いますか?ローダーが問題を修正する必要があるので、私は問題を誤解しています。 – Hachi

+0

ええ、ローダーが私の問題を解決しました。 loader.once( 'complete'、callback) - >コールバックにローダーリソースからスプライトを作成し、ステージに追加します。 – NavCore

関連する問題