There comes a point in an app’s lifecycle when you decide to widen your audience. Although your app works great and your daily downloads are off the charts, not everyone is happy. Why?🤔 No RTL (Right to Left) Layout support. A few languages — like Arabic, Hebrew or Persian — are written from Right to Left. To handle them, Android supports […]
There comes a point in an app’s lifecycle when you decide to widen your audience. Although your app works great and your daily downloads are off the charts, not everyone is happy. Why?🤔
No RTL (Right to Left) Layout support.
A few languages — like Arabic, Hebrew or Persian — are written from Right to Left. To handle them, Android supports RTL layouts from API 17+ i.e., Android 4.1 (Jelly Bean).
Woohoo… 🎉 Done!!! Your app now supports RTL. But lets see how it looks. You can check your app in RTL mode by doing one of two things.
You’ll need to make the following changes in all your Layouts
There is a much easier way to do the above changes without going through all the files and then doing it manually. Android Studio can do this for you. Just go to Android Studio > Refactor > Add RTL support where possible…
I would recommend checking your app once after applying this change as you might not want all your Layouts/Views to be RTL. If you want to force any layout to LTR then just add android:layoutDirection="ltr" to that view.
Time to search for all those drawables that you’d want to mirror for RTL. Since resources can have variants based on device aspects like Orientation, Screen Density, API version, you can also have variants for different Layout Directions i.e., RTL or LTR. All you need to do is add the RTL variants of the drawables that you want to be mirrored.
If your Toolbar defines back arrow nav icon like this
This back button is consistent with Layout Directions.
But only works on API 23+ 😣, below that it just points Left.
And what if you don’t have RTL variant for your drawables? You can use android:autoMirrored="true". But this works on api 19+ only. If you want to mirror Drawables or any View on API <19, there is sort of a temporary workaround that can come in handy. You can just add android:rotationY="@integer/locale_mirror_flip" to the View you want to be mirrored. And define
I used this trick to mirror a Progress Indicator that doesn’t support RTL. This works on API 11+.
Animations that use X axis for transitions will not work properly. For example TranslateAnimation — You will need to add a RTL variant for these as well.
For example: android:fromXDelta="-100%p" will become android:fromXDelta="100%p" in RTL variant of this animation,
android:pivotX="25%" will become android:pivotX="75%".
I would recommend defining all animations, layout, etc as xml resource only. Because RTL support for those programmatically defined layouts and animations is painful. Also, the compilation will take more time if you modify a Java file instead of XML.
If you still find these defined in your java files then this is what you’ll need to do:
If you have completed all of the above then I believe you should have pretty good RTL Support. There are few more things you can look at for your final touch.
Support for RTL is not that difficult on Android. I wish I had supported it from day 1 instead of doing it at a later stage. If you found something missing or have suggestions then do comment.
*This post was first published on Rishabh’s Medium
RTL Support on Android — Here’s all you need to know was originally published in Coding Big — The Crowdfire Engineering Blog on Medium, where people are continuing the conversation by highlighting and responding to this story.