How to fix "Cancel & Voice button on left" in RTL Search Bar

Question

I developed an RTL android app. I implemented an Actionbar that contains a Search bar. but the Cancel and Voice button are on the right of the text.

As you know, the cancel and voice button must be on the left of the text in RTL.

Notice:

I've added the layoutDirection & textDirection for all of AppBarLayout, Toolbar & SearchView.
I've added the android:supportsRtl="true" at Manifest too.
I've set Gravity to End.

Layouts:

app_bar_home.xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layoutDirection="rtl"
    tools:context=".home.Home">

    <android.support.design.widget.AppBarLayout
        android:layoutDirection="rtl"
        android:textDirection="rtl"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:layoutDirection="rtl"
            android:textDirection="rtl"
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>

    <include layout="@layout/content_home" />

</android.support.design.widget.CoordinatorLayout>

menu_main.xml:

<?xml version="1.0" encoding="utf-8"?>
<menu
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/menu_search"
        android:icon="@android:drawable/ic_menu_search"
        android:title="@string/search_hint"
        app:showAsAction="always|collapseActionView"
        app:actionViewClass="android.support.v7.widget.SearchView"/>
</menu>

searchable.xml:

<?xml version="1.0" encoding="utf-8"?>
<searchable
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:label="@string/app_name"
    android:hint="@string/search_hint"/>

Manifest:

<activity
    android:name=".home.Home"
    android:label="@string/app_name"
    android:theme="@style/AppTheme.NoActionBar">
    <intent-filter>
        <action android:name="android.intent.action.SEARCH" />
    </intent-filter>
    <meta-data
        android:name="android.app.searchable"
        android:resource="@xml/searchable" />
</activity>

So, How can I change the position of SearchBar Buttons to the left?

I add the layouts and styles in the description now. @Ogbe – Sadra Amlashi Jun 17 '19 at 06:24 — Sadra Amlashi, Jun 17 '19 at 06:24

score 0 · Answer 1 · edited Jun 17 '19 at 05:29

0

you can set rtl diration just for toolbar .

<androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layoutDirection="rtl"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:popupTheme="@style/AppTheme.PopupOverlay">

and customize your toolbar .

edited Jun 17 '19 at 05:29

Sadra Amlashi

120
1
9

answered Jun 17 '19 at 05:24

Adnan Abdollah Zaki

4,328
6
52
58

I mentioned that I it that, for both `Toolbar` and `AppBarLayout`. but still, the buttons are on the right. – Sadra Amlashi Jun 17 '19 at 05:26

How to fix "Cancel & Voice button on left" in RTL Search Bar

1 Answers1