iosswiftxcodestoryboard

UIToolbar force left to right semantic not working


I have a UIListView controller that has a UIToolbar at the bottom with 3 buttons. Like so:

Storyboard setup

Now, I am trying to make my app support other languages and when I change the language of the iPhone simulator to some language that is right-to-left, the toolbar shows up like this:

enter image description here

It seems like the next day button is being switched with the previous day button. Because when I press on the left button it, changes the date forward a day. I, of course, do not want this, can anyone help me fix this issue.

Here is what I tried to so far to try and fix this issue:

I tried to change the semantic of the UIToolbar to "Force Left-to-Right" I tried doing the same for all the views in that the toolbar is in, no luck. I even tried changing the semantic programmatically like this:

toolbar.semanticContentAttribute = .forceLeftToRight 

At this point, I have no idea how to fix this issue, any help is appreciated!


Solution

  • Attempting to force a left to right layout is not the correct approach for dealing with a right-to-left locale.

    In a right to left locale, an arrow on the right side, pointing right would be expected to go back. If you forced the button on the left to go back it would be confusing for those users.

    There are two similar, but subtly different SF symbols you can use for the arrows you are showing:

    arrowtriangle.left.fill and arrowtriangle.right.fill will always show the same image, regardless of locale. That is they will always point left and right.

    arrowtriangle.backward.fill and arrowtriangle.forward.fill will adjust their appearance depending on the locale. In a left-to-right locale, arrowtriangle.backward.fill will point left, but in a right-to-left locale it will point right.

    The toolbar is changing its layout to suit the locale - In a right to left locale it puts the first bar button item on the right.

    Because you have used arrowtriangle.left.fill as the image for your first button item, you end up with an arrow pointing in the wrong direction.

    Simply change the image names to use forward and backward instead of left/right and it will all work automatically.