2016-09-15 9 views
1

にグループで繰り返し処理するにはどうすればphaserjs、私はそれにいくつかのスプライトを追加した。その後はPhaser.js

this.fruitsOutline = this.game.add.group(); 

でグループを作成しています。すべてが正しく機能しています。 onDragStartイベントハンドラの内部から、this.fruitsOutlineにアクセスしたい場合は今、ドラッグのコールバックを追加するときは、コンテキストが欠落している未定義

var GameState = { 

init:function(){ 
    this.physics.startSystem(Phaser.Physics.ARCADE); 
}, 
create: function() { 

    var innerImgPos = {x:150,y:200}; 
    var outlineImgPos = {x:460,y:200}; 
    var FIXED_DISTANCE_Y = 150; 

    var gameData = [ 
     //...some data 
    ]; 


    this.background = this.game.add.sprite(0, 0, 'background'); 

    this.overlapHappen = false; 

    this.startPos = {x:150,y:197}; 


    this.fruitsOutline = this.game.add.group(); 
    this.fruitsInner = this.game.add.group(); 

    for(var i=0; i<gameData.length; i++){ 

     fruitOuter = this.fruitsOutline.create(outlineImgPos.x,((outlineImgPos.y+25)*i)+FIXED_DISTANCE_Y,gameData[i].fruit_outline.img); 
     fruitOuter.name = gameData[i].fruitName; 
     fruitOuter.anchor.setTo(.5); 
     fruitOuter.customParams = {myName:gameData[i].fruit_outline.name}; 
     this.game.physics.arcade.enable(fruitOuter); 
     fruitOuter.body.setSize(100,100,50,50); 

     fruitInner = this.fruitsInner.create(innerImgPos.x,((innerImgPos.y+25)*i)+FIXED_DISTANCE_Y,gameData[i].fruit_inner.img); 
     fruitInner.name = gameData[i].fruitName; 
     fruitInner.anchor.setTo(0.5); 
     fruitInner.inputEnabled = true; 
     fruitInner.input.enableDrag(); 
     fruitInner.input.pixelPerfectOver = true; 
     fruitInner.originalPos = {x:fruitInner.position.x,y:fruitInner.position.y}; 
     this.game.physics.arcade.enable(fruitInner); 
     fruitInner.body.setSize(100,100,50,50);    



     fruitInner.customParams = {myName:gameData[i].fruit_inner.name,targetKey:fruitOuter,targetImg:gameData[i].fruit_outline.name}; 
     fruitInner.events.onDragStart.add(this.onDragStart); 
     fruitInner.events.onDragStop.add(this.onDragStop,this); 
    }   

}, 
update: function() { 

}, 
onDragStart:function(sprite,pointer){ 
    console.log(this.fruitsInner) //this gives undefined I expect an array 
}, 
onDragStop:function(sprite,pointer){ 
    var endSprite = sprite.customParams.targetKey; 
    console.log(endSprite); 
    this.stopDrag(sprite,endSprite) 
}, 
stopDrag:function(currentSprite,endSprite){ 
    var currentSpriteRight = currentSprite.position.x + (currentSprite.width/2); 
    if (!this.game.physics.arcade.overlap(currentSprite, endSprite, function() { 
     var currentSpriteTarget = currentSprite.customParams.targetImg; 
     var endSpriteName = endSprite.customParams.myName; 
     console.log(currentSpriteTarget,endSpriteName); 
     if(currentSpriteTarget === endSpriteName){ 
      currentSprite.input.draggable = false; 
      currentSprite.position.copyFrom(endSprite.position); 
      currentSprite.anchor.setTo(endSprite.anchor.x, endSprite.anchor.y); 
     } 
     console.log(currentSprite.width); 

     })) { 
     //currentSprite.position.copyFrom(currentSprite.originalPosition); 
     currentSprite.position.x = currentSprite.originalPos.x; 
     currentSprite.position.y = currentSprite.originalPos.y; 
     } 
}, 
render:function(){ 
    game.debug.body(this.fruitsInner); 
    //game.debug.body(this.orange_outline); 
} 
} 

答えて

2

を与えています。

(2番目の引数としてthisを追加する)ことをお試しください:

fruitInner.events.onDragStart.add(this.onDragStart, this); 

ああ、(どこかの状態にあるか)コールバック内this.fruitsInnerPhaser.Groupのインスタンスになり、そのコメントのような配列が言うではありません。あなたが探している配列はおそらくthis.fruitsInner.childrenです。