Mohammad Taqi
Mohammad Taqi

Reputation: 179

Rtl support for drawableEnd of AppCompatEditText Android

I am using this AppCompatEditText like this

<com.google.android.material.textfield.TextInputLayout
                        android:id="@+id/tilCountry"
                        style="@style/LoginTextInputLayoutStyle"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginStart="@dimen/dpSixteen"
                        android:layout_marginEnd="@dimen/dpSixteen"
                        android:layout_marginBottom="@dimen/dpTwenty"
                        android:background="@null"
                        android:hint="@string/chooseCountry"
                        app:hintTextAppearance="@style/TextAppearance.App.TextInputLayout"
                        app:hintTextColor="@color/moonRaker">

                        <androidx.appcompat.widget.AppCompatEditText
                            android:id="@+id/etCountry"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:drawableEnd="@drawable/ic_blue_right"
                            android:drawableTint="@color/blue"
                            android:focusable="true"
                            android:imeOptions="actionNext"
                            android:textAppearance="@style/SignupEditText"
                            tools:targetApi="m" />
                    </com.google.android.material.textfield.TextInputLayout>

when user change the language to arabic every thing looks fine with rtl but drawableEnd not changing from right to left. with English with Arabic

Arrow must switch to left side when arabic selected with mirror effect.

my drawable code

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="7.41dp"
    android:height="12dp"
    android:viewportWidth="7.41"
    android:viewportHeight="12"
    **android:autoMirrored="true"**>
  <path
      android:pathData="M0,10.58 L4.58,6 0,1.41 1.41,0l6,6 -6,6Z"
      android:fillColor="#1b47db"/>
</vector>

What is wrong here?

Upvotes: 0

Views: 102

Answers (2)

Mohammad Taqi
Mohammad Taqi

Reputation: 179

I found the solution :-

I just give the layout direction to my parent xml layout like this

public static void rtlConversion(Activity activity, String lang, View view) {
    int layoutDirection = View.LAYOUT_DIRECTION_LTR; // default to LTR
    if (lang != null && (lang.equals(ARABIC_CODE) || lang.equals(URDU_CODE))) {
      layoutDirection = View.LAYOUT_DIRECTION_RTL;
    }
activity.getWindow().getDecorView().setLayoutDirection(layoutDirection);
    if (view != null) {
      view.setLayoutDirection(layoutDirection);
      view.requestLayout();
      view.invalidate();
    }
  }

By doing this every view in the that layout will adjust the rtl and ltr by it's own. like icon mirroring, text alignment etc..

Even I think this line is also not needed.

activity.getWindow().getDecorView().setLayoutDirection(layoutDirection);

because I use material.textfield.TextInputLayout it has these four property in layoutDirection

<attr name="layoutDirection">
            <!-- Left-to-Right. -->
            <enum name="ltr" value="0" />
            <!-- Right-to-Left. -->
            <enum name="rtl" value="1" />
            <!-- Inherit from parent. -->
            <enum name="inherit" value="2" />
            <!-- Locale. -->
            <enum name="locale" value="3" />
</attr>

Defines the direction of layout drawing. This typically is associated with writing direction of the language script used. The possible values are "ltr" for Left-to-Right, "rtl" for Right-to-Left, "locale", and "inherit" from parent view. If there is nothing to inherit, "locale" is used. "locale" falls back to "en-US". "ltr" is the direction used in "en-US". The default for this attribute is "inherit".

So with this default inherit property, views can adjust the layoutDirection from parent layout. By doing this... I think proper rtl ltr UI we can handle.

If you got a simpler solution? Let me know!

Upvotes: 0

Viraj S
Viraj S

Reputation: 74

Drawable should be set from the start if the language is Arabic, otherwise, it should be set from the end.

android:textDirection="anyRtl"

try this way

Upvotes: 0

Related Questions