Xamarin- Rtl Support in Xamarin.android

Question

I need to support Rtl in my app here is what I did

Replace all the occurrences of layout attributes that contains ‘left’ and ‘right’ to ‘start’ and ‘end’ respectively. For example, android:paddingLeft should become android:paddingStart

Reference

Here is how android studio render my xml layout

my xml code

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/layout"
    android:orientation="vertical"
    >
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:layout_marginLeft="22.3dp"
        android:layout_marginStart="22.3dp"
        android:layout_marginRight="15.3dp"
        android:layout_marginEnd="15.3dp"
        android:layout_marginTop="19dp">



    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="13.3sp"
            android:textColor="@color/bluey_grey"
            android:textAllCaps="true"
            android:text="@string/language" />
        <TextView
            android:id="@+id/languageText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="13.3sp"
            android:textColor="@color/orange_two"
            android:text="English" />
    </LinearLayout>
    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_marginTop="15dp"
        android:background="@color/silver_two" />
    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="18dp">
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toLeftOf="@+id/notificationChk"
            android:layout_toStartOf="@+id/notificationChk"
            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:orientation="vertical">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="13.3sp"
                android:textColor="@color/bluey_grey"
                android:textAllCaps="true"
                android:text="@string/push_notifications" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="11.7sp"
                android:textColor="@color/cool_grey"
                android:text="@string/pushNotificationDetails" />
        </LinearLayout>
        <android.support.v7.widget.AppCompatCheckBox
            android:id="@+id/notificationChk"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:checked="true"
            app:buttonTint="@color/colorPrimary"
            android:layout_centerVertical="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true" />
    </RelativeLayout>
    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_marginTop="15dp"
        android:background="@color/silver_two" />
    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="18dp">
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toLeftOf="@+id/newsLatterChk"
            android:layout_toStartOf="@+id/newsLatterChk"

            android:layout_alignParentLeft="true"
            android:layout_alignParentStart="true"
            android:orientation="vertical">
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="13.3sp"
                android:textAllCaps="true"
                android:textColor="@color/bluey_grey"
                android:text="@string/newsletter" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textSize="11.7sp"
                android:textColor="@color/cool_grey"

                android:text="@string/newsLetterDetails" />
        </LinearLayout>
        <CheckBox
            android:id="@+id/newsLatterChk"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true" />
    </RelativeLayout>
    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_marginTop="15dp"
        android:background="@color/silver_two" />
    <TextView
        android:text="Save"
        android:layout_marginTop="20dp"
        android:padding="10dp"
        android:textSize="14.7dp"
        android:textAllCaps="true"
        android:layout_gravity="center"
        android:gravity="center"
        android:textColor="@color/orange_three"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/saveBtn" />
    <TextView
        android:id="@+id/logoutBtn"
        android:text="@string/logout"
        android:textAllCaps="true"
        android:layout_marginTop="15dp"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:textColor="@color/tomato" />
    <Space
        android:layout_width="wrap_content"
        android:layout_height="20dp" />
    </LinearLayout>
</LinearLayout>

but when I run in xamarin here is what I get

what I miss to full support Rtl ??

here is my post in Xamarin Forums for more detail about my issue

Answer 1

this issue cause my minimum sdk is 16 when I changed to 17 it works , seem to be bug in xamarin

Update

you can keep minSdkVersion 16 as you want but make sure you set targetSdkVersion to 17+

<uses-sdk android:minSdkVersion="16" android:targetSdkVersion="25" />

Note when you set target from manifest to auto use target its not placed in manifest it keep like that

<uses-sdk android:minSdkVersion="16"  />

so set version manual

Answer 2

You still using hardCoded directions(right,left) in some views, i know that for < 17 API support but try to compile without it.

also you could use the param "layoutDirection" in views

   android:layoutDirection = "locale"
   android:layoutDirection = "inherit"
   android:layoutDirection = "rtl"
   android:layoutDirection = "ltr"

Reference: Native RTL support in Android 4.2