Search the Community

I need align the text align horizontal and vertical center based on the background. The background is a graphics object. My code is not work properly. text = this.add.text(0, 0, ['2asdfasdf', '/nasdfn/', 'ndfdf'], { fontFamily: 'sans-serif', color: '#776e65', align: 'center', fontSize: 55, fontStyle: 'bold', padding: 0, }); It result is the picture, it just align based on the most longest text not the background.

I try something pretty easy (I think) but I cant make it work. The want that the faces are aligned in their direction between two world space Vector3. The position on the screenshot is not correct but that's not the problem. I tried it with lookAt for the mesh and also played a bit around with RotationFromAxis from this example http://www.babylonjs-playground.com/#1QM99D#6 But its always not correct rotated, correct would it be when they are aligned along the edge between the two vertices where currently the feces are placed. Any suggestions?

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 all, Is it possible to align a group to the center of the stage? I have a series of buttons that comprise the locked and unlocked levels of my game. Because the number of levels is arbitrary (as for now) is it possible to determine the width of the group in order to align it to the stage?

Hey guys, I'm kinda new to JavaScript and Phaser and working on some tutorials. Now I started a little project and tried to reproduce some of the tutorial functions into a simple game. Right now I'm working on the main menu, painting a background and adding a logo to the top center of the screen. While my Loading Screen I show a sprite centered with this.preloadBar = this.add.sprite(this.world.centerX, this.world.centerY, 'preloaderBar'); and it's working like a charme. Now I tried to set up the logo in the main menu with this.logo = this.add.sprite(this.world.CenterX, this.world.CenterY, 'logo'); Now the outcome looks like below... The Game is set to 800x600 and if I set the parameters manually like this.add.sprite(300, 300, 'logo.png); it works as it should. So somehow the world.center coordinates are screwed up I guess, any ideas? Well i'm sure most of you got an idea, cause this is probably a quite dumb question, so sorry for that Greetings

I am experiencing an odd problem aligning the text of a BitmapText to the center. I am successfully able to wrap the text by using the "maxWidth" property, but the alignment of the text is uneven / jagged (see attached screenshot). It doesn't align to the center, some words are more to the left, and some are more to the right. I can't understand what's going on. I am using the code below (typescript): let hintText:Phaser.BitmapText = this.game.make.bitmapText(0, 100, "MSR", "", 25, "center"); hintText.maxWidth = 310; this.add(hintText); hintText.text = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean ut mattis velit. Cras placerat fermentum dictum. Donec at semper enim. Donec euismod pulvinar volutpat."

Hello, I have encountered a problem. When I add text to stage I can get it vertically centered, could you please advise me a way? I tried the same way as examples show, but that doesn't work for me. In the picture you can see the result I get. I want to center (horizontally and vertically) on the purple boxes in background. I don't know how to achieve that, as you can see I set background color to black to see how the text is positioned. There is obviously larger space below the numbers comparing it to the space above them. Is there a way to set this equal? var style = {font: 'bold 25px Times New Roman', fill: '#ffffff', backgroundColor: '#000000'} var text = this.add.text(Math.floor(start.x), Math.floor(start.y), number, style); text.anchor.set(0.5); text.x = Math.floor(start.x + image.width / 2); text.y = Math.floor(start.y + image.height / 2); Thank you very much for your advice. EDIT Just to be clear, I'm using the latest Phaser version. I also tried: text.setTextBounds(0, 0, 30, 30); text.boundsAlignV = 'middle'; Which resulted in the bottom of the black area (text background colored) being aligned with the bottom of my box (which is 30 x 30) as seen in the second picture.

Hello everyone! I am just getting in Game development in Phaser. I am trying to create Android application and I am using this: https://build.phonegap.com/apps to convert my Phaser code into .apk file. Everything works great and it is the same as in the browser. Also I am scaling the content with devicePixelRatio. However, after the last update(today) of the Android WebView there is a problem with my app... I can't see the whole world and everything is hidden anywhere outside the display. I tried some things, but nothing can fix my problem! I am looking forward for your replies! See the pics before/after:

I just found that Phaser uses Pixi to render text and also found that align property, which by default is 'left' does not apply to single line text. I need it to be centered. I just want to display score text. I can position the field in middle of my text border but only when it has a value of '0'. When it has value of '12000' it looks like it is shifted towards right side of the border. What would you do in this case? What is the best way to pass this problem without changing 'x' coordinate of the text field? I am making a Phaser 2.2.2 game.