Fix Layout changes if device language is Arabic

Question

I have to support both "ltr" and "rtl" in my app. I have tested my app on ltr and it works but when i tested my layouts on an arabic phone languague the images and the texts are dispersed

Issue

The image and textbox in rtl are inversed. I want the textbox and image position are same as in the "ltr"

My layout.xml:

   <?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:card_view="http://schemas.android.com/tools"
    android:id="@+id/card_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardBackgroundColor="@color/Grey_50"
    app:cardCornerRadius="0dp"
    app:cardUseCompatPadding="true"
    card_view:cardCornerRadius="dp">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

                <ImageView
                    android:id="@+id/image_news"
                    android:layout_width="60dp"
                    android:layout_height="60dp"
                    android:layout_gravity="end"
                    android:layout_alignParentEnd="true"
                    android:layout_alignParentRight="true"
                    android:layout_centerHorizontal="true"
                    android:layout_centerVertical="true"
                    android:scaleType="fitXY" />

                <TextView
                    android:id="@+id/txt_news_title"
                    android:layout_width="match_parent"
                    android:layout_gravity="start"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:layout_toLeftOf="@+id/image_news"
                    android:layout_marginRight="3dp"
                    android:textSize="13sp" />
                <View
                    android:id="@+id/view1"
                    android:layout_below="@+id/image_news"
                    android:layout_width="match_parent"
                    android:layout_height="1dp"
                    android:layout_marginTop="10dp" />

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="horizontal">

                        <ImageView
                            android:id="@+id/recent"
                            android:layout_width="15dp"
                            android:layout_height="15dp"
                            android:layout_alignParentLeft="true"
                            android:layout_alignParentStart="true"
                            android:layout_alignParentTop="true"
                            android:layout_gravity="center"
                            android:layout_marginRight="2dp"
                            android:background="@drawable/ic_recent"
                            android:textAlignment="center" />

                        <TextView
                            android:id="@+id/txt_timedate"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_alignParentTop="true"
                            android:layout_toEndOf="@+id/recent"
                            android:layout_toRightOf="@+id/recent"
                            android:text="20:49"
                            android:textColor="@color/Grey_600"
                            android:textSize="16sp" />
                </LinearLayout>
        </RelativeLayout>
</android.support.v7.widget.CardView>

Image showing app screen supporting ltr and rtl.

@Nas wow it works ! but they're saying layout direction is only used in API 17 and higher(current min is 16) Does this warning message makes fear? — Mahdi H, Apr 16 '17 at 10:47

score 2 · Accepted Answer · answered Apr 16 '17 at 11:11

2

set layout direction as ltr for the parent layout

Its only support from api level 17. If you want to support for previous api level you have to make separate xml layout file for arabic.

answered Apr 16 '17 at 11:11

Nas

2,158
1
21
38

Thanks but can u send me some documentation or any stuff about making separate xml file for arabic? – Mahdi H Apr 16 '17 at 12:08
Wow awesome @Nas only one thing if would i want to ask something: I want when the activity launches..it lauches before it a TRANSPARENT slider saying like : Don't forget to swipe down to get the latest news – Mahdi H Apr 16 '17 at 13:56
sorry am not clear with your question. is this log text? – Nas Apr 16 '17 at 14:03
Like the first picture in this post : http://stackoverflow.com/questions/12013334/how-do-you-create-a-transparent-demo-screen-for-an-android-app – Mahdi H Apr 16 '17 at 14:06
You can find the answer on the same page by scrolling. If you need any more assistance post it as a new question. – Nas Apr 16 '17 at 14:09

score 1 · Answer 2 · answered Apr 16 '17 at 10:04

Replace your XML code with this

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:card_view="http://schemas.android.com/tools"
    android:id="@+id/card_view"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:cardBackgroundColor="@color/Grey_50"
    app:cardCornerRadius="0dp"
    app:cardUseCompatPadding="true"
    card_view:cardCornerRadius="dp">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layoutDirection="rtl">

        <ImageView
            android:id="@+id/image_news"
            android:layout_width="60dp"
            android:layout_height="60dp"
            android:layout_gravity="end"
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:scaleType="fitXY" />

        <TextView
            android:id="@+id/txt_news_title"
            android:layout_width="match_parent"
            android:layout_gravity="start"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_toLeftOf="@+id/image_news"
            android:layout_toStartOf="@+id/image_news"
            android:layout_marginRight="3dp"
            android:textSize="13sp" />
        <View
            android:id="@+id/view1"
            android:layout_below="@+id/image_news"
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:layout_marginTop="10dp" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/recent"
                android:layout_width="15dp"
                android:layout_height="15dp"
                android:layout_alignParentLeft="true"
                android:layout_alignParentStart="true"
                android:layout_alignParentTop="true"
                android:layout_gravity="center"
                android:layout_marginRight="2dp"
                android:background="@drawable/ic_recent"
                android:textAlignment="center" />

            <TextView
                android:id="@+id/txt_timedate"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentTop="true"
                android:layout_toEndOf="@+id/recent"
                android:layout_toRightOf="@+id/recent"
                android:text="20:49"
                android:textColor="@color/Grey_600"
                android:textSize="16sp" />
        </LinearLayout>
    </RelativeLayout>
</android.support.v7.widget.CardView>

Sorry it worked with android:layoutDirection="ltr" not android:layoutDirection="rtl" — Mahdi H, Apr 16 '17 at 10:49

Mayur Patel · Answer 3 · 2019-06-21T10:58:42.863

0

Need to make sure that android:supportsRtl is FALSE in androidManifest

<application
    android:allowBackup="true"
    android:icon="@drawable/ic_original"
    android:label="@string/app_name"
    android:supportsRtl="false" />

edited Jun 21 '19 at 10:58

answered Jun 20 '19 at 13:24

Mayur Patel

161
1
6

Fix Layout changes if device language is Arabic

3 Answers3