Search the Community
Showing results for tags 'Anchor'.
-
Since graphic sprites have no anchors, the only way to position a texture used with BeginTextureFill is the defaultAnchor of the texture. However, changing the defaultAnchor seems to have no effect. I've tried every combination of anchoring and positioning and this is the consistent result (below). Both texture and sprite are the same dimensions (400 x 400).
-
Hello! I'm trying to make a game like raze (flash game from 2010~ish) and I currently have a level import system and moving animated sprite. I am using matter.js for the physics. I am also using phaser 3 v3.12 as tiled hit detection(? idk how to say) breaks in the the newer versions. I saw the demo for angle to pointer (http://phaser.io/examples/v2/arcade-physics/angle-to-pointer#gv) and wondered if something like it existed in Phaser 3. and also, it would be great if i could anchor a sprite onto another moving one (the weapon on the player) as then it would work, but idk how to do it as I couldn't find anything for phaser 3. Thanks for your help, I might not respond right away! AND here is my project link(so i can work on it on the multiple different computers that I have): https://codesandbox.io/s/k0mq2lj533 ~~~~technically I'm copying the code from the "making modular game worlds in phaser 3 part 5" demo, but this is how I get started on projects as I'm not good at setting things up!
-
hi, I found out that the anchor.y is inaccurate for BitmapText. When I set it to 0.5, it doesn't align to center, but if I set anchor.y to 0 and add half of it's height to y, it will correctly locate at center.
-
Hi guys, How can you change the anchor of a sprite inside a group? For a sprite outside the group I use this.add.sprite(100,100, 'sprite').setOrigin(0,0); I tried the next code but It didn't work leprosy = this.add.group([{ key: '001_leprosy', setXY: { x: 444, y: 115 }, setOrigin : {x:0, y:0} } ]); Any ideas? Thanks.
-
Hello, How can i set anchor point in Phaser 3? setOrigins not working for me. For example: Phaser2 Phaser 3 Sprite is "jumping" on resize. How can i fix it?
-
I am using the last official release 2.6.2. Given the following code, which can be found on the following jsbin: http://jsbin.com/lazefep/1/edit?js,output var MainState={ create: function(){ var circleGraphic = new Phaser.Graphics(); circleGraphic.beginFill(0xFFBBBB); circleGraphic.drawCircle(0, 0, 100); circleGraphic.endFill(); circleSprite = this.game.add.sprite(0, 0, circleGraphic.generateTexture()); //circleSprite.anchor.setTo(0.5); // (Try barSprite anchor below first.) Ugh, this doesn't fix it... var barGraphic = new Phaser.Graphics(); barGraphic.beginFill(0x88FF88); barGraphic.lineTo(250, 0); barGraphic.lineTo(250, 10); barGraphic.lineTo(0, 10); barGraphic.lineTo(0, 0); barGraphic.endFill(); var barSprite = this.game.add.sprite(this.game.world.width/2, this.game.world.height/2, barGraphic.generateTexture()); barSprite.addChild(circleSprite); //barSprite.anchor.setTo(0.5); // Why doesn't the child adjust to the anchor with the parent? } }; var game = new Phaser.Game(640, 480, Phaser.CANVAS, 'phaser-example', MainState); As long as the two lines remain commented out, what is rendered makes perfect sense: 1. A circleSprite is created and registered to position 0,0 of the parent sprite that it is later attached to. 2. A barSprite is created and its top left is added to the center of the world. 3. The circleSprite is added as a child to barSprite, and consequently, the top left of that child sprite is found at 0,0 of the parent sprite. As a result, you can see a sort of sideways "b" graphically depicted. Now, my (reasonable?) assumption is that the parent barSprite can be treated like any ordinary sprite as a composite whole. Anything I do to the parent sprite should automatically cause cascaded adjustments to the children so that the parent sprite would behave as it would if it were just an individual sprite on its own without any children behavior artifacts. However, if you notice, uncomment the line that sets the barSprite anchor, and the child does not follow. The child remains in place as if the anchor to the parent is not applied. To make matters worse, I have no easy recourse. I cannot recover the intended sideways "b" by uncommenting the circleSprite anchor. Is this a bug with anchor? Or is this intended behavior for some reason? What are my best options? (I am also curious if this behavior will exist in v3.) Also, please make me aware if you happen to see a violation of good/best practices! -
Hi. I'm using phaser 2.6.2 and I have an issue every time I create a text and set it's anchor. The text seem to fly away a great distance after setting it's anchor. Example: if I were to set the anchor to 0.5, the text moves to a location far greater than it's size. If I create a text, it's anchor is at default 0 (top left of text)? If I were to change it to 0.5, rather than the text center itself about the anchor, it goes a great distance away from it, like really far. this.goldCoinsText = this.game.add.text(350.6, 86.1, '5000', {font: "20px Arial", fill: "#ffe488"}); this.goldCoinsText.anchor.set(0.5);
-
Hi Guys there, There is a game with multiple layers. The lowest one is the water. Camera is above. The layers are scaled differently and moving with different speed imitating that its a 3D world. I want to use only a screen size tile sprite rectangle for the water to avoid full world broad animated tile map. There is a zoom navigation tool which scales all the layers up and down based the on the centre of the screen and I want to zoom the water as well. Question one: Can I set the "anchor" base point for the scale on a tile sprite? I couldn't find any property for it. And the base point is the top left corner by default. Question two: Does it make sense to try saving hardware resources in this way? The water surface has to be about 20 times bigger than the screen. Many thanks for any help.
-
Hello I use Phaser.text in my game. I want to align the text so I use text.anchor.set(0.5). On my small text it work fine but on my biggest text it make it blurry I read on forum to use text.anchor.x = Math.round(text.width * 0.5); but it only make my text disappear Is there an other way to do or maybe I'm doing it wrong question = game.add.text(310,180,questions[nbalea], {fontSize: '32px', fill: '#000' }); question.anchor.set(0.5); question.anchor.x = Math.round(question.width * 0.5); Thank you
-
hi, i'm coding a pinball game in js with phaser and p2physics. I search how i can do rotation with a anchor point. I want create the rotation for the flipper but method rotateLeft or rotateRight do the rotation by the center's sprites. I want create a rotation around topleft and top right point of the sprite to do a flipper movement. orry for my bad english, thx.
-
Hello, I have two TextFields. The first one is aligned right by setting anchor.x = 1. The second one is aligned left by default. There is a visual issue if text value of the RIGHT aligned TextField is changing on the different one with different width: the digits are "dancing" a little, while the LEFT aligned TextField stands. Here is the example: https://jsfiddle.net/7dv61c63/ Don't know is it a bug at PIXI but I'll be much appreciated for any suggestion how to fix this issue.
-
Hello, I have searched a solution for a problem for long time and didn't found, if someone have some ideas I am taking all x) did someone know if it's possible to rotate a group of bodies around an anchor point, I set some bodies for invisble walls and my objective is to turn them around by 90° around an anchor point, I know It must be not very comprehensive so I set up an Image to explain myself. In the screen, I have 2 bodies and I want them to turn around the red dot what must be my anchor point, I know it's impossible in arcade so I tried in P2 physics and impossible to found any solution :/ Thanks for reading, feel free to leave a feedback
-
I am experimenting positioning the sprites correctly on the screen when setting anchor to the center of the sprite. However I can not get the expected result. For example, I want to have a group of sprites place on the screen like a tile map. Some sprites are on the edge of the screen and have a graphics object as their texture. While sprites not on the edge are image sprites generated from images. I want the image sprites stay on their tile while have their anchor set to 0.5. Here is my code for the example in this URL http://phaser.io/sandbox/vXVjSgyw/play: (You need to paste my code into the create method to see the result) function create() { // disable these lines, and the other sprite will be blank var sprite = game.add.sprite(0, 0, 'phaser'); // blank sprite will add last used texture var pics = game.add.group(); for (let i = 0; i <= 7; i++) { for (let j = 0; j <= 5; j++) { var b; if (i === 0 || j === 0 || i === 7 || j === 5) { b = new Phaser.Sprite(game) // or game.add.sprite(0,0) var g = new Phaser.Graphics(0,0) g.beginFill(0xFF0000,0.5) g.lineStyle(1, 0xAACCCC); g.drawRect(0,0,100,100) g.endFill() b.addChild(g) b.x = i * 100; b.y = j * 100; } else { b = game.add.sprite(i * 100, j * 100, 'mushroom'); } b.anchor.set(0.5) pics.add(b) } } } When I set all the sprites anchor to 0.5 the image sprites shift to their top left corner. If I only set the edge sprites anchor to 0.5 it looks fine. What is the problem? Does the anchor setting change the texture's position?
-
Hi all, I'm new to Phaser and I want to ask about something that became a problem for me and sorry for my bad english. So I have shape sprite that I add child to the background sprite. I want to make the background fit the screen size and it working. I also make the shape sprite anchored to middle (0.5, 0.0) so whatever the shape the position still in the middle. The problem came when I try to create collision. If the size is original size then the collision is correct but when I resize the background the collider start to not fit the sprites. I search for this and found out that if I comment out the anchor then the collider is fit to the sprite again. I also already do setting on body size. Here is the list of code I use //scaling background background.scale.set(game.width, game.height); //add physics game.physics.arcade.enable(shape_sprite) //anchor sprite shape_sprite.anchor.set(0.5, 0); //reset shape_sprite collision shape_sprite.body.setSize( shape_sprite.width*shape_sprite.parent.scale.x, shape_sprite.height*shape_sprite.parent.scale.y, shape_sprite.width*shape_sprite.parent.scale.x/2, 0 ); I think maybe I'm doing it wrong. without anchor: with anchor:
-
Hello, there is a small difference between the sprite body anchor between phaser 2.6 and older versions. In previous versions the body will anchor with the sprite anchor, meaning that if you set the sprite anchor to 0.5 in both axis the body stayed in the center of the sprite, changing the body size would keep it in centre, in the newer version the body is always anchored to the top left of the sprite regardless the anchor of the sprite. Is this behaviour intended? Just wondering if I should re-center my sprites bodies or if this will change to the old behaviour. Thanks.
-
I'm using P2 physics, and I'm creating a relatively intricate border around the screen that I want balls to bounce against. I am scaling all assets on the screen for 3 different aspect ratios, depending on the user's screen size. I create the border like this: bgOverlay = otherSpriteGroup.create(gameWidth / 2, gameHeight / 2, "bgOverlay"); bgOverlay.anchor.setTo(0.5, 0.5); bgOverlay.scale.setTo(scale.x, scale.y); bgOverlay.body.clearShapes(); bgOverlay.body.loadPolygon("physicsData", "bgOverlay"); bgOverlay.body.setCollisionGroup(otherCollisionGroup); bgOverlay.body.collides(bubbleCollisionGroup, otherHitBubble, this); bgOverlay.body.static = true; The trick is that I scale all assets using a Phaser Point, scale.x and scale.y. But when I load in the polygon data using bgOverlay.body.loadPolygon, it takes in actual pixel values, and I can't scale bgOverlay.body. I am not sure how to scale the numbers in the physics data. Any ideas? -
Hi, just upgraded from phaser 2.4.4 to 2.6.2 and I'm having trouble with sprites bodies. My sprites are set to an anchor of x 0.5 and y 0.5, the body was also being set at that position on 2.4.4 version but after updating the body doesn't change position when changing the anchor. Is there any way to move the sprite body to the center of the sprite? Thanks.
-
I've noticed that "this.player.anchor.setTo(0.5);" will create a bounding box centered on the player.body in Phaser v2.2.2 when "this.game.debug.body(this.player);" is used, but in the latest Phaser v2.6.2, "this.game.debug.body(this.player);" shows a bounding box anchored at top left even if "this.player.anchor.setTo(0.5);" is previously applied. Was this an intentional change or a bug in the new version?
-
Hello, I have an issue with the createLayer() function, My player anchor point is 0.5 but the Tiles in the layer comes with default anchor How I can set all my layer tiles anchor to 0.5? this is the current result (The big red square is the player) And this is the expected thanks
-
Hi! With this code I try to put a text object in the center of a sprite, which is in its turn is centered relatively to the world. var sprite = game.add.sprite(0, 0, 'phaser'); sprite.anchor.set(0.5); sprite.x = game.world.width * 0.5; sprite.y = game.world.height * 0.5; var text = game.make.text(sprite.width * 0.5, sprite.height * 0.5, "Yo", { font: "10px Arial", fill: "#ffffff", align: "center" }); text.anchor.set(0.5); sprite.addChild(text); But what I get is this: instead of this: What am I doing wrong and how to achive my goal? Thanks!
-
When manipulating sprites, we can do this.sprite.anchor.setTo(.5,.5), which sets the rotation and "origin" of the sprite to its center, rather then the upper left corner. How can we do the same for the game world? So when we spawn a sprite on (0,0), it spawns to the center of the game world/canvas?
-
Hey, I'm using p2 physics and I have a sprite (pixel line) that is rotating around some point (beginning of the line). For rotation I use angularVelocity. To display my sprite correctly I had to set it's anchor to (0,1) and it works fine, but collision box remained where it was before. Please check out my code and attached image game.physics.startSystem(Phaser.Physics.P2JS); game.physics.p2.setImpactEvents(true); this.obstacle1CollisionGroup = this.game.physics.p2.createCollisionGroup(); this.obstacle = game.add.sprite(700, 400, "line"); this.physics.p2.enable(this.obstacle, true); this.obstacle.body.setCollisionGroup(this.obstacle1CollisionGroup); this.obstacle.anchor.setTo(0,1) this.obstacle.body.angularVelocity = 0.3; this.obstacle.body.angularDamping = 0;
-
Hello. I'm having an issue with stripes of pixels from one sprite appearing in other sprites sporadically. I've included an image below. I'm loading a spritesheet made by the free version of texture packer. I then make sprites out of the textures, set anchors to 0.5, set scale to 3. Animations are performed by changing textures. I also emulate a camera by having one container named 'stage' and moving it around based on the player's position and window dimensions. I frequently (but inconsistently) see an extra strip of pixels appear on the left edge of sprites as if the source rectangle were subtly incorrect. Am I not supposed to mix the anchors, scale, and a 'camera' in this manner? I've tried rounding/flooring the x,y positions of certain objects and some visual errors have lessened. I used to have a bug where I would get 1 pixel-wide vertical stripes between tiles which was fixed by flooring the camera container's x and y. However I'm still getting some of these 1 pixel strips from neighboring textures in the sprite sheet. Perhaps these are unrelated visual issues. Here's a picture of one: The pixel strip is to the left of the greenish character. It is particularly odd because it is the only thing that happens to be 1 pixel wide. Everything else is scaled by 3. Here are the sections of code that are involved: // creating the character (well, just the body, its part of // a larger class that adds many things to a container like // the gun and other effects) this.body = new PIXI.Sprite.fromFrame('guy0.png') this.body.scale.x = this.body.scale.y = 3 this.body.anchor.x = this.body.anchor.y = 0.5 this.addChild(this.body) // and later the character is animated like this if (this.animationLastFrameTime + this.animationFrameDelay < now ) { this.runFrame++ if (this.runFrame > 5) { this.runFrame = 0 } this.animationLastFrameTime = now this.body.texture = PIXI.Texture.fromFrame('guy'+this.runFrame+'.png') } // and here is the camera code from an entirely different area of the program // NOTE: Math.round prevents vertical stripes from appearing between the tiles stage.x = Math.round(-player.x + window.innerWidth * 0.5) stage.y = Math.round(-player.y + window.innerHeight * 0.5) Any idea what I'm doing wrong? Thanks!
-
Hi, i have a custom buttons and i want apply anchor. How to do it? Custom buttons: this.button_start = this.btn("Play a game", this.play_game, 2.03, 15.1, 2, 8.5, 140, 30); btn: function(name, functions, anc1X, anc1Y, anc2X, anc2Y, w, h) { this.button = this.game.add.button(this.game.width, this.game.height, '', functions, this); this.button.name = name; this.button.width = w; this.button.height = h; this.button.anchor.set(anc1X, anc1Y);//Temporary this.text = this.add.bitmapText(this.game.width, this.game.height, 'Text_mainmenu', this.button.name, 46); this.text.anchor.set(anc2X, anc2Y);//Temporary } /* name - the name of the button functions - button function anc1X - first anchor.setX anc1Y - first anchor.setY anc2X - two anchor.setX anc2Y - two anchor.setY */
-
Hello, In my repository hosted on the link below, I have a game I am doing for a research project. You'll notice in the src/game-behaviors.js file, I have a method to create a chicken. However, whenever I try to change the anchor on a created chicken in a group, the chicken renders for a frame or so, then disappears. https://github.com/wheelerj/chickens-in-space I've had to 'offset' the creation coordinate of these chickens in order to fix this, but it causes unwanted behaviors when I want to rotate them, and cause them to oscillate due to gravitational wave effects. Thank you for your help. (I have also asked this question here http://stackoverflow.com/questions/36036793/setting-anchor-on-group-sprite-destroys-them)
