leonidas Posted October 1, 2015 Share Posted October 1, 2015 HeyFirst of all mad props whoever created this beautiful piece of software! Here, is my questions regarding addChild method. From my AS3 days I remember child display object's coordinates were relative to parent. So, in this vein I was hoping gray square would be sitting in the top left corner of the blue square. Instead of this I got strange positioning, also child object(gray one) lost his propositions. Upon loading it was 100/100 square. I guess I am missing crucial line of code but I cannot figure out where am I messing uppreload() { this.game.load.image("debugRect", "Scripts/assets/debugRect.png"); //Load Map TIles this.game.load.image("bigOrange", "Scripts/assets/secondMap/Untitled-3-0.png"); this.game.load.image("gray", "Scripts/assets/secondMap/Untitled-3-1.png"); this.game.load.image("lightBlue", "Scripts/assets/secondMap/Untitled-3-2.png"); this.game.load.image("red", "Scripts/assets/secondMap/Untitled-3-3.png"); this.game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL; ; } create() { const introSquareSprite = this.game.add.sprite(10,10, "debugRect"); introSquareSprite.anchor.setTo(0, 0); introSquareSprite.width = 960; introSquareSprite.height = 650; const gray = this.game.add.sprite(0, 0, "gray"); gray.anchor.setTo(0, 0); introSquareSprite.addChild(gray); }and here is screenshot Link to comment Share on other sites More sharing options...
rich Posted October 1, 2015 Share Posted October 1, 2015 Child coordinates are indeed relative to the parent (just like Flash), but in the same vein setting the width/height adjusts the scale of the object, which of course influences the positioning, which is what appears to be going on here. Link to comment Share on other sites More sharing options...
leonidas Posted October 1, 2015 Author Share Posted October 1, 2015 Child coordinates are indeed relative to the parent (just like Flash), but in the same vein setting the width/height adjusts the scale of the object, which of course influences the positioning, which is what appears to be going on here. Thanks for replay. So...if I remove parent object's sizing it takes whole window and if I explicitly set sizing of parent and child objects child's position and scale is still messed up and create() { const introSquareSprite = this.game.add.sprite(10, 10, "blueBG"); introSquareSprite.anchor.setTo(0, 0); introSquareSprite.width = 960; introSquareSprite.height = 650; const gray = this.game.add.sprite(0, 0, "gray"); gray.width = 100; gray.height = 100; gray.anchor.setTo(0, 0); introSquareSprite.addChild(gray); } Link to comment Share on other sites More sharing options...
rich Posted October 1, 2015 Share Posted October 1, 2015 In the code above the width/height of both objects is still being set, so they're both still being scaled. And scaling anything influences the position of their descendants. Remove the width/height values from both objects and the grey box will be in the top left of its parent, as it has a 0x0 position. Link to comment Share on other sites More sharing options...
leonidas Posted October 1, 2015 Author Share Posted October 1, 2015 As I said removing sizing from the parent object makes is scale up to take whole viewport and gray one still not positioned correctly create() { const introSquareSprite = this.game.add.sprite(10, 10, "blueBG"); introSquareSprite.anchor.setTo(0, 0); const gray = this.game.add.sprite(0, 0, "gray"); gray.anchor.setTo(0, 0); introSquareSprite.addChild(gray); } Link to comment Share on other sites More sharing options...
rich Posted October 1, 2015 Share Posted October 1, 2015 Yes because you've set your game scale mode to 'SHOW_ALL' (i.e. resize the canvas to fill all available space). If you want the display to be the size specified in your game constructor then use NO_SCALE as the scale mode. Link to comment Share on other sites More sharing options...
leonidas Posted October 1, 2015 Author Share Posted October 1, 2015 Yes because you've set your game scale mode to 'SHOW_ALL' (i.e. resize the canvas to fill all available space). If you want the display to be the size specified in your game constructor then use NO_SCALE as the scale mode.Nope. Same... Parent is stretched over whole viewport. Child's position is still messed up Link to comment Share on other sites More sharing options...
rich Posted October 1, 2015 Share Posted October 1, 2015 Then you've something else, somewhere not in the code above, causing it. CSS perhaps. I bet if you right-click the canvas and inspect it, the dimensions do not match those given in the game constructor (unless you set that to something like 100%?) leonidas 1 Link to comment Share on other sites More sharing options...
leonidas Posted October 2, 2015 Author Share Posted October 2, 2015 Then you've something else, somewhere not in the code above, causing it. CSS perhaps. I bet if you right-click the canvas and inspect it, the dimensions do not match those given in the game constructor (unless you set that to something like 100%?)I am moron....smh Thanks for your help Link to comment Share on other sites More sharing options...
Recommended Posts