Bakshish

Members
  • Content Count

    4
  • Joined

  • Last visited

Posts posted by Bakshish


  1. Hi,

    I have a button in my game which has two child elements(a text aligned top center in and another text aligned bottom center). The issue is the child texts are also taking click of the button which should not happen. Here is the code for this:

    Fiddle : https://jsfiddle.net/3sf1b2zL/18/

    var game = new Phaser.Game(480,320,Phaser.AUTO,'');
    var gameStates = {};
    
    gameStates.Main = function(game){};
    
    gameStates.Main.prototype = {
    	preload: function() {
               this.load.crossOrigin = "Anonymous";
               this.load.image('shop','https://s1.postimg.org/6fz3duzc0r/user_input_box.png'); 
    	},
    
    	create:function(){
    	   var btnText = this.add.text(0,0,"Game Loaded",{fill:"#ffffff"});
               var infoText = this.add.text(0,0,"This is a description of the game. It is only an informative text and it should not take click of its parent button. Try clicking this text",{fill:"#ffffff", wordWrap:true,wordWrapWidth:450});
    	   var shopBtn = this.add.button(0,0,'shop', function(){
    	   btnText.text = "Shop Clicked";}, this);
               shopBtn.anchor.setTo(0.5, 0);    
               shopBtn.addChild(infoText);
               shopBtn.addChild(btnText);
               btnText.alignTo(shopBtn, Phaser.TOP_CENTER);
               infoText.alignTo(shopBtn, Phaser.BOTTOM_CENTER,0,20);
               shopBtn.x = this.game.width/2;
               shopBtn.y = this.game.height*0.2;
    	}
    }
    
    game.state.add('main',gameStates.Main);
    game.state.start('main');

    Please help me so that only the button takes click and text should not take the click

     

    Thanks


  2. Hi,

    I have created a tabbed text using tabs property of text. This works fine until I try to add color to text using addColor function of text. This removes the tabbing done on the text. Example here:

    //Phaser game initialization
    var game = new Phaser.Game(480, 320, Phaser.AUTO, 'game_div');
    var gameStates = {};
    
    gameStates.Main = function(game) {};
    
    gameStates.Main.prototype = {
      create: function() {
        var textHeadings = this.add.text(20, 20, '', {
          fill: "#ffffff",
          tabs: [80, 140]
        });
        var headingsArray = [
          ['id', 'score', 'country'],
          ['1', '2300', 'US'],
          ['2', '1890', 'AUS'],
          ['3', '1000', 'US']
        ];
        textHeadings.parseList(headingsArray);
        //uncomment this line to see the issue
        //textHeadings.addColor("#00ff00",2);
      }
    }
    
    game.state.add('Main', gameStates.Main);
    game.state.start('Main');
    

     


  3. Hi,

    I have a button in my game which has two child elements(a text aligned top center in and another text aligned bottom center). The issue is the child texts are also taking click of the button which should not happen. Here is the code for this:

    Fiddle : https://jsfiddle.net/3sf1b2zL/18/
     

    var game = new Phaser.Game(480,320,Phaser.AUTO,'');
    var gameStates = {};
    
    gameStates.Main = function(game){};
    
    gameStates.Main.prototype = {
    	preload: function() {
               this.load.crossOrigin = "Anonymous";
               this.load.image('shop','https://s1.postimg.org/6fz3duzc0r/user_input_box.png'); 
    	},
    
    	create:function(){
    	   var btnText = this.add.text(0,0,"Game Loaded",{fill:"#ffffff"});
               var infoText = this.add.text(0,0,"This is a description of the game. It is only an informative text and it should not take click of its parent button. Try clicking this text",{fill:"#ffffff", wordWrap:true,wordWrapWidth:450});
    	   var shopBtn = this.add.button(0,0,'shop', function(){
    	   btnText.text = "Shop Clicked";}, this);
               shopBtn.anchor.setTo(0.5, 0);    
               shopBtn.addChild(infoText);
               shopBtn.addChild(btnText);
               btnText.alignTo(shopBtn, Phaser.TOP_CENTER);
               infoText.alignTo(shopBtn, Phaser.BOTTOM_CENTER,0,20);
               shopBtn.x = this.game.width/2;
               shopBtn.y = this.game.height*0.2;
    	}
    }
    
    game.state.add('main',gameStates.Main);
    game.state.start('main');