Message alignment for non-English characters

[espruino-discuss2]

Posted at 2024-06-12 by JeonLab

See attached pictures. Those English messages are center aligned for both short and long messages, but those messages in Korean (wonder if other non-English languages are the same) alignment is not done well. The first line is aligned at the center, but starting the second line (wrapped), the messages starts from the middle of the screen and the rest of the lines are pushed even further to the right.
Would there be any fix for this?
Thanks.

---

Attachments:

• Untitled.png

[espruino-discuss2]

Posted at 2024-06-13 by @thyttan

I've seen this with Swedish as well, as can be seen on screenshots uploaded to this issue: espruino/BangleApps#3037

This comment specifically refers to this indentation/offset problem: espruino/BangleApps#3037 (comment)

I think it got better for me but not entirely solved. If I click the text body to show it all within its own scroller I think it never has those extra indentations.

What firmware do you use?
What Gadgetbridge version?
What options do you have set related to messages in Gadgetbridge?

---

Posted at 2024-06-13 by JeonLab

@thyttan, the firmware version is 2v22 and my phone is (unfortunately) an iphone, so I'm using iOS integration, not Gadgetbridge.
Thanks.

---

Posted at 2024-06-14 by @gfwilliams

and my phone is (unfortunately) an iphone, so I'm using iOS integration, not Gadgetbridge.

Ok, thanks - well that's a help and narrows it down. So you've got a Fonts app installed to provide the extra fonts?

I think it got better for me but not entirely solved. If I click the text body to show it all within its own scroller I think it never has those extra indentations.

Do you think you could confirm that?

Do you think you could include some text that exhibits the problem?

Ideally if you're running in the Web IDE and you can get some code like this that reproduces the issue it'll be a ton easier for me to dig into:

g.setFontIntl().setFontAlign(0,0).drawString("Hello\nThis\nis\ntext",88,88)

---

Posted at 2024-06-14 by JeonLab

So you've got a Fonts app installed to provide the extra fonts?

Yes, I have installed the Fonts (Korean) app.

---

Posted at 2024-06-19 by JeonLab

g.setFontIntl().setFontAlign(0,0).drawString("Hello\nThis\nis\ntext",88,88)

I tried to run this code in the Web IDE and it gave me this response.

=Graphics: {
  flip: function () { [native code] }
 }

---

Posted at 2024-06-19 by @gfwilliams

What was on the screen?

---

Posted at 2024-06-19 by JeonLab

@gfwilliams, see attached screenshot. I didn't see it on my clock screen. :)

---

Attachments:

• download.png

---

Posted at 2024-06-20 by @gfwilliams

Ok. I think that's pasting the code in on the left?

If you put it on the right, then make sure the text under the upload button says RAM, then click upload it'll be better. Maybe add g.clear(1) before to clear the screen.

However my point was: If you can change the text from Hello this is text to some Korean text and reproduce the issue, that would be ideal as it'll be easy for me to then debug it.

The problem we have with iOS is the second you disconnect from the watch, we lose the messages that were saved, so I can't easily get hold of the message that caused the problem

---

Posted at 2024-06-20 by JeonLab

Hi Gordon,
I tried the code with some Korean as shown below on the editor window and load to the RAM.

g.clear();
g.setFontIntl().setFontAlign(0,0).drawString("한글 표시를\n시험중입니다.\n대한민국\n한글을 사랑합니다.",88,88);

Attached is the screenshot. The Korean characters are not displayed correctly, but the alignment looks fine.

---

Attachments:

• download.png

---

Posted at 2024-06-21 by @gfwilliams

Ahh, sorry about that - it looks like the IDE is struggling to convert Unicode properly. If you escape it (eg by pasting this into Node.js or your web browser's console):

console.log("한글 표시를\n시험중입니다.\n대한민국\n한글을 사랑합니다.".split("").map(c=>"\\u"+c.charCodeAt().toString(16).padStart(4,0)).join(""))

It'll give you the escaped unicode:

"\ud55c\uae00\u0020\ud45c\uc2dc\ub97c\u000a\uc2dc\ud5d8\uc911\uc785\ub2c8\ub2e4\u002e\u000a\ub300\ud55c\ubbfc\uad6d\u000a\ud55c\uae00\uc744\u0020\uc0ac\ub791\ud569\ub2c8\ub2e4\u002e"

And you can try that with:

g.setFontIntl().setFontAlign(0,0).drawString("\ud55c\uae00\u0020\ud45c\uc2dc\ub97c\u000a\uc2dc\ud5d8\uc911\uc785\ub2c8\ub2e4\u002e\u000a\ub300\ud55c\ubbfc\uad6d\u000a\ud55c\uae00\uc744\u0020\uc0ac\ub791\ud569\ub2c8\ub2e4\u002e",88,88);

And when I do that I see the issue with text alignment (attached) - so thanks! I think that's all I need to get started fixing this (but that means it'll need a new firmware version - it's not JS)

---

Attachments:

• korean.png

---

Posted at 2024-06-21 by @gfwilliams

Filed an issue at espruino/Espruino#2519

---

Posted at 2024-06-21 by JeonLab

Thank you, Gordon.
I got the same result as your screenshot.
I'll look forward to the updated firmware.
Thanks again, and have a nice weekend!
Cheers!

---

Posted at 2024-06-21 by @gfwilliams

Thanks! You too!

If you try with a cutting edge firmware build now, it should be fixed.

---

Posted at 2024-06-21 by JeonLab

@gfwilliams, that was lightning-fast fix!!
I just flashed the cutting edge firmware (2v22.45) and confirmed it works fine now. See attached screenshot.
Thank you so much!!

---

Attachments:

• download.png