1

phina.js Tips集 #当たり判定編 - Qiita

上記サイトを参考にphina.jsライブラリを使用し、下記のコードで四方八方から向かってくる正方形をよけてスコアを稼ぐ避けげーを作ろうと思っているのですが、100行目の

            if(shape.hitTestElement(sprite)){
              var self = this;
              self.exit();
            }

これらを追加するとコンソール上に”ReferenceError: sprite is not defined”(spriteが定義されていない)と表示されてしまい、うまくいきません。上記のコードを除くと正常に動作します。

initプロパティでspriteは定義しているように見えるのですが、何が問題なのでしょうか?
対処法をご教示いただきたいです。よろしくお願いします。

環境

OS: windows10
ブラウザ: firefox


対象のコード

<html>
  <head>
    <meta charset='utf-8' />
    <meta name="viewport" content="width=device-width, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />

    <title>Getting started | phina.js</title>
    <!-- phina.js を読み込む -->
    <script src='http://cdn.rawgit.com/phi-jp/phina.js/v0.2.0/build/phina.js'></script>

    <!-- メイン処理 -->
    <script>
      // phina.js をグローバル領域に展開
phina.globalize();

var ASSETS = {
  //image
  image: {
    'tomapiko': 'https://rawgit.com/phi-jp/phina.js/develop/assets/images/tomapiko.png',
  },
};

var SCREEN_WIDTH = 640;
var SCREEN_HEIGHT = 960;
var SPEED = 5;
var ENEMY_INTERVAL = 10;

// MainScene クラスを定義
phina.define('MainScene', {
  superClass: 'DisplayScene',
  init: function() {
    this.superInit();
    // 背景色を指定
    this.backgroundColor = '#444';
    // スプライト画像作成
    var sprite = Sprite('tomapiko').addChildTo(this);
    // 初期位置
    sprite.x = 325;
    sprite.y = 740;

      // 一定フレーム経過したら
    // タッチ保持イベント
    this.onpointstay = function(e) {
      // スプライトをタッチ位置に
      sprite.x = e.pointer.x;
      sprite.y = e.pointer.y;
    };
    // タッチ移動イベント
    this.onpointmove = function(e) {
      // スプライトをタッチ位置に
      sprite.x = e.pointer.x;
      sprite.y = e.pointer.y;
    };

  },

  update: function(app){

      if (app.frame % ENEMY_INTERVAL === 0) {
          // 敵生成
          //長方形を描画
        for(var kali = 1; kali <= 50;){
          var default_x = Random.randint(-15,655);
          var default_y = Random.randint(-15,975);
          if (-5 <= default_x && default_x <= 645 && -5 <= default_y && default_y <= 965){}
          else{
            var shape = Shape().addChildTo(this);
            shape.setSize(10,10);
            shape.x = default_x;
            shape.y = default_y;

            if (-15 <= default_x && default_x <= 320 && -15 <= default_y && default_y <= 330){
              // Physicalクラスを適用して移動
              var phis_y_left_up = Random.randint(1,4)
              var phis_x_left_up = Math.sqrt(25 - phis_y_left_up^2)
              var last_x = phis_x_left_up
              var last_y = phis_y_left_up
            }
            else if (321 <= default_x && default_x <= 655 && -15 <= default_y && default_y <= 330){
              var phis_x_right_up = Random.randint(-1,-4)
              var phis_y_right_up = Math.sqrt(25 - phis_x_right_up^2)
              var last_x = phis_x_right_up
              var last_y = phis_y_right_up
            }
            else if (-15 <= default_x && default_x <= 320 && 331 <= default_y && default_y <= 975){
              var phis_y_left_down = Random.randint(-1,-4)
              var phis_x_left_down = Math.sqrt(25 - phis_y_left_down^2)
              var last_x = phis_x_left_down
              var last_y = phis_y_left_down
            }
            else if(321 <= default_x && default_x <= 655 && 331 <= default_y && default_y <= 975){
              var phis_x_right_down = Random.randint(-1,-4)
              var kali_k = Math.sqrt(25 - phis_x_right_down^2)
              var phis_y_right_down = kali_k * -1
              var last_x = phis_x_right_down
              var last_y = phis_y_right_down
            }
            shape.physical.force(last_x , last_y);
            if(shape.hitTestElement(sprite)){
              var self = this;
              self.exit();
            }

          }
          kali++;
        }
      }
  }

});

// メイン処理
phina.main(function() {
  // アプリケーション生成
  var app = GameApp({
    //startLabel: 'main', // メインシーンから開始する
    assets: ASSETS, //loading image
  });
  // アプリケーション実行
  app.run();
});

    </script>
  </head>
  <body>

  </body>
</html>

1 件の回答 1

2
  init: function() {
    // <省略>
    // スプライト画像作成
    var sprite = Sprite('tomapiko').addChildTo(this);
    // 初期位置
    sprite.x = 325;
    sprite.y = 740;

こちらで定義した変数 sprite はこの関数のローカル変数となります。init に設定している関数の外からは参照できません。そのため update プロパティに設定している関数の中から参照しようとするとエラーとなります。

対処方法としては、 sprite を update プロパティに設定している関数から参照できる場所に定義すること、となります。

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。