Showing posts with label right-to-left. Show all posts
Showing posts with label right-to-left. Show all posts

Tuesday, October 17, 2017

Why does this code, written backwards, print “Hello World!”

Leave a Comment

Here is some code that I found on the Internet:

class M‮{public static void main(String[]a‭){System.out.print(new char[] {'H','e','l','l','o',' ','W','o','r','l','d','!'});}}     

This code prints Hello World! onto the screen; you can see it run here. I can clearly see public static void main written, but it is backwards. How does this code work? How does this even compile?

Edit: I tried this code in IntellIJ, and it works fine. However, for some reason it doesn't work in notepad++, along with cmd. I still haven't found a solution to that, so if anyone does, comment down below.

4 Answers

Answers 1

There are invisible characters here that alter how the code is displayed. In Intellij these can be found by copy-pasting the code into an empty string (""), which replaces them with Unicode escapes, removing their effects and revealing the order the compiler sees.

Here is the output of that copy-paste:

"class M\u202E{public static void main(String[]a\u202D){System.out.print(new char[]\n"+         "{'H','e','l','l','o',' ','W','o','r','l','d','!'});}}   " 

The source code characters are stored in this order, and the compiler treats them as being in this order, but they're displayed differently.

Note the \u202E character, which is a right-to-left override, starting a block where all characters are forced to be displayed right-to-left, and the \u202D, which is a left-to-right override, starting a nested block where all characters are forced into left-to-right order, overriding the first override.

Ergo, when it displays the original code, class M is displayed normally, but the \u202E reverses the display order of everything from there to the \u202D, which reverses everything again. (Formally, everything from the \u202D to the line terminator gets reversed twice, once due to the \u202D and once with the rest of the text reversed due to the \u202E, which is why this text shows up in the middle of the line instead of the end.) The next line's directionality is handled independently of the first's due to the line terminator, so {'H','e','l','l','o',' ','W','o','r','l','d','!'});}} is displayed normally.

For the full (extremely complex, dozens of pages long) Unicode bidirectional algorithm, see Unicode Standard Annex #9.

Answers 2

It looks different because of the Unicode Bidirectional Algorithm. There are two invisible characters of RLO and LRO that the Unicode Bidirectional Algorithm uses to change the visual appearance of the characters nested between these two metacharacters.

The result is that visually they look in reverse order, but the actual characters in memory are not reversed. You can analyse the results here. The Java compiler will ignore RLO and LRO, and treat them as whitespace which is why the code compiles.

Note 1: This algorithm is used by text editors and browsers to visually display characters both LTR characters (English) and RTL characters (e.g. Arabic, Hebrew) together at the same time - hence "bi"-directional. You can read more about the Bidirectional Algorithm at Unicode's website.
Note 2: The exact behaviour of LRO and RLO is defined in Section 2.2 of the Algorithm.

Answers 3

The Character U+202E mirrors the code from right to left, it is very clever though. Is hidden starting in the M,

"class M\u202E{..." 

How did I found the magic behind this?

Well, at first when I saw the question I tough, "it's a kind of joke, to lose somebody else time", but then, I opened my IDE ("IntelliJ"), create a class, and past the code... and it compiled!!! So, I took a better look and saw that the "public static void" was backward, so I went there with the cursor, and erase a few chars... And what happens? The chars started erasing backward, so, I thought mmm.... rare... I have to execute it... So I proceed to execute the program, but first I needed to save it... and that was when I found it!. I couldn't save the file because my IDE said that there was a different encoding for some char, and point me where was it, So I start a research in Google for special chars that could do the job, and that's it :)

A little about

the Unicode Bidirectional Algorithm, and U+202E involved, a briefly explain:

The Unicode Standard prescribes a memory representation order known as logical order. When text is presented in horizontal lines, most scripts display characters from left to right. However, there are several scripts (such as Arabic or Hebrew) where the natural ordering of horizontal text in display is from right to left. If all of the text has a uniform horizontal direction, then the ordering of the display text is unambiguous.

However, because these right-to-left scripts use digits that are written from left to right, the text is actually bi-directional: a mixture of right-to-left and left-to-right text. In addition to digits, embedded words from English and other scripts are also written from left to right, also producing bidirectional text. Without a clear specification, ambiguities can arise in determining the ordering of the displayed characters when the horizontal direction of the text is not uniform.

This annex describes the algorithm used to determine the directionality for bidirectional Unicode text. The algorithm extends the implicit model currently employed by a number of existing implementations and adds explicit formatting characters for special circumstances. In most cases, there is no need to include additional information with the text to obtain correct display ordering.

However, in the case of bidirectional text, there are circumstances where an implicit bidirectional ordering is not sufficient to produce comprehensible text. To deal with these cases, a minimal set of directional formatting characters is defined to control the ordering of characters when rendered. This allows exact control of the display ordering for legible interchange and ensures that plain text used for simple items like filenames or labels can always be correctly ordered for display.

Why create some algorithm like this?

the bidi algorithm can render a sequence of Arabic or Hebrew characters one after the other from right to left.

P.S.: I know it's not the best answer, but it was fun to crack the problem first :P

Answers 4

Chapter 3 of the language specification provides an explanation by describing in detail how the lexical translation is done for a Java program. What matters most for the question:

Programs are written in Unicode (§3.1), but lexical translations are provided (§3.2) so that Unicode escapes (§3.3) can be used to include any Unicode character using only ASCII characters.

So a program is written in Unicode characters, and the author can escape them using \uxxxx in case the file encoding does not support the Unicode character, in which case it is translated to the appropriate character. One of the Unicode characters present in this case is \u202E. It is not visually shown in the snippet, but if you try switching the encoding of the browser, the hidden characters may appear.

Therefore, the lexical translation results in the class declaration:

class M\u202E{ 

which means that the class identifier is M\u202E. The specification considers this as a valid identifer:

Identifier:     IdentifierChars but not a Keyword or BooleanLiteral or NullLiteral IdentifierChars:     JavaLetter {JavaLetterOrDigit} 

A "Java letter-or-digit" is a character for which the method Character.isJavaIdentifierPart(int) returns true.

Read More

Thursday, July 27, 2017

table cell views are not right aligned

Leave a Comment

I am trying to right-align my table cells.

simulator

I have set 'Semantic' property to 'Force Right-to-Left' value through the whole visual tree.

Desired layout:

Desired state

Visual tree:

Visual tree

There aren't any visual definitions in code...

EDIT:

After @dirtydanee suggestion:

trailed

6 Answers

Answers 1

Stack view configuration

For your stack view you should have alignment set to Leading to make it start at the leading position for your language, which is the right most side for you. Then you set Semantic to Force Right-to-Left.

It is important that you have tied the stack views edges to it's container's edges, so that the stack view will size to it's container. It is also important that you let the labels have dynamic size. Both of these conditions seems to be met in your code, although it is not entirely clear.

Answers 2

Just do following thing to assign text right side in tableviewCell

  • Step 1: Select view in contect View cell in StoryBoard

  • Step 2: Alignment text to right side.

Description image

Answers 3

It seems that your constraints are wrong.

Constrain your labels to the right and align their text to the right.

Here is an example:

enter image description here

And running on simulator:

enter image description here

Answers 4

If you use leading and trailing constraints to layout your UILabel elements, everything gets switched automagically to the right site if using a Right-To-Left language. There is no need to change the NSTextAlignment (.natural is default and the one you need) or the UISemanticContentAttribute of the UILabel. enter image description here


Be aware that you need to have at least one RTL language added to your project localizations:

enter image description here


When the language of your iPhone / iPad is set to Hebrew everything should work as expected:

enter image description here

Answers 5

It is also depend on Your Device Selected Lang.

You can try to use left instead of leading and use right instead of trailing

Answers 6

I tried a demo and i think what you need to do is set semantic for each label separately

go to perekSourcelabel set semantic right-to-left then do same for header label

dont set semantic for your stack view or the whole perekTableViewcell

Read More

Thursday, July 20, 2017

text-align-last css property Swift Equivalent

Leave a Comment

What is the swift Equivalent for 'text-align-last' css property? I prefer a codeless solution.

Here is what i have done and what i get:

enter image description here

The last line (sometimes the only one) is aligned to the left, which is inconvenient.

2 Answers

Answers 1

You need to change the label's text from Plain to Attributed, then you can paste any string and the alignment, as well as other attributes, will hold. So basically any text style that can create on word processor application can be used here.

In the following example I've used pages (Mac application) to edit the text format as I liked and copied it to the label text box in Xcode.

enter image description here

Here is a picture of the simulator running the app: enter image description here

Answers 2

While it is not possible to apply different aligns on a single label, if the last(and sometime only) line should be aligned to the right why not align the entire label to the right?

enter image description here

EDIT

If that doesn't fix you problem then I don't think it's possible to resolve without code.

In the case you do decide to write some code you could look into determining which is the last line of your string (maybe: How to get text from nth line of UILabel? ) and try to apply different formatting with AttributedString.

If that works then you can always subclass UILabel and override func layoutSubviews() to calculate this automatically for you. This way you won't have to think about it again!

Read More

Friday, March 18, 2016

design from ltr to rtl automatically

Leave a Comment

I am a French website that is in LFR (Left to Right) And the client is wanting to translate the site in hebrew thus transforming it to RTL (Right to Left). In all Hebrew Website the design is reversed

https://he.wikipedia.org/wiki/

https://www.google.co.il/

Is there a way to do this automatically ? Again I am not talking about the text direction. I want to flip it horizontally the design, like a mirror effect.

1 Answers

Answers 1

Your mileage may vary. Some web page generation tools support RTL with easy switch, while with others the WYSIWYG breaks completely when you specify <html dir="rtl">. Browser fragmentation may also be an issue: some browser simply don't support RTL bulleted lists correctly.

There are quite a few good tutorials on the Web; I would recommend https://hacks.mozilla.org/2015/09/building-rtl-aware-web-apps-and-websites-part-1/ and https://hacks.mozilla.org/2015/10/building-rtl-aware-web-apps-websites-part-2/. If you look up Google to search for more articles, please remember that this field is quickly changing, and some recipes of few years ago may be obsolete.

You may find the automation with css-flip or rtlcss useful.

Note that localization is generally not easy, and invariably requires a manual touch. You must understand the target culture very well to recognize tiny glitches that may look awful to the end-user. For example, on Hebrew Website you need different image for the "back" button. On Arabic sites, some numbers should be represented by indic digits, but other numbers are expected to use the usual digits.

Issues of first day of week, etc. are common for LTR localizations, too.

Read More