text direction rtl

[sharon]

hi,

I need to add text in hebrew but it seems like the align prop changes only the position, how can i use "rtl"?

this is my css:

Quote

 

canvas {

direction:rtl;

}

 

 

            

this looks ok (but obviously not useful with phaser) :

Quote

 

      var c = this.game.canvas

      var test = c.getContext("2d");

      test.font="25px Arial";

      var str1 = "טקסט עברית ואנגלית text שאלה?";

      test.fillText(str1, 0, 0);

 

           

           

This is not (the words order changes):

Quote

var style = {

            "font": "25px Arial"        

      }

        this.game.add.text(0, 0, str1,style);

 

           

 

 

What's the diff? and how can i fix it? :\

[rich]

There's no built-in way to handle this. Text objects have their own internal canvas element, which the text is rendered to. so changing the main canvas won't do anything. You can add the direction property to the Text texture canvases, but because they are unattached to the dom most browsers seem to ignore it. If you manage to get it working, let me know.

[sharon]

oh no  I tried and you right, it ignores the rtl.

I also couldn't find a script that fix that. I wonder how others overcome this problem...

Thank you anyway!

[rich]

I know, it's a bit ridiculous really. You'd think once you set rlt that was it, fillText would just use it, regardless if the canvas is in the page or not. But that really doesn't seem to be the case. For now I'd suggest you either use graphics, BitmapText (because then you control the order directly), or DOM element overlays.

[sharon]

Yes!BitmapText did the trick thank you!!

I thought about the other options but I couldn't use graphics because the text is dynamic and not DOM because it moves on drag...

[eriwine]

Greetings from 3 years in the future! I'm currently trying to get RTL order working with Arabic text in Phaser 2. @sharon would you please elaborate on how you got BitmapText to render RTL? 

[Vivek Agrawal]

On 2/19/2019 at 10:27 PM, eriwine said:

Greetings from 3 years in the future! I'm currently trying to get RTL order working with Arabic text in Phaser 2. @sharon would you please elaborate on how you got BitmapText to render RTL? 

even I am trying to use arabic, as far as I can see that it goes beserk when we have line breaks either via \n or wordWrap, so I temporary got it working by doing like this:

"اجمعوا الطرود لتحصلوا" + "\n" + "على خصم حتى" + "\n" + "50 NIS"
 

if you keep english and arabic and \n text separate and connect them using + it works fine.