Search code examples
androidandroid-layoutright-to-leftandroid-menuoptionmenu

MenuItem icon is not displaying correctly in RTL Layouts


In RTL, option menu item icon not displayed correctly!! but in LTR, everything is displayed well and beautifully.

With the help of this command, I make the RTL program

getWindow().getDecorView().setLayoutDirection(View.LAYOUT_DIRECTION_RTL);

My menu layout.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"
    android:gravity="start"
    android:layoutDirection="rtl"
    android:layout_gravity="start">
    <item
        android:id="@+id/action_more"
        android:icon="@drawable/ic_add_white_24dp"
        android:title=""
        app:showAsAction="always">
        <menu>
            <item
                android:id="@+id/action_settings"
                android:icon="@drawable/ic_wb_sunny_black_24dp"
                android:title="آیتم شماره 1"/>

            <item
                android:id="@+id/action_settings2"
                android:icon="@drawable/ic_star_black_24dp"
                android:title="آیتم شماره 2"/>

            <item
                android:id="@+id/action_settings3"
                android:icon="@drawable/ic_wb_sunny_black_24dp"
                android:title="آیتم شماره 3"/>
        </menu>
    </item>
</menu>

Please help me to fix this.

enter image description here Screenshot


Solution

  • Custom Toolbar popupTheme, override

    android:layout_marginStart android:layout_marginEnd

    First add this lines to your res/values/styles.xml

    <style name="PopupTheme" parent="ThemeOverlay.AppCompat.Light">
        <item name="android:layout_marginStart">2dp</item>
        <item name="android:layout_marginEnd">2dp</item>
    </style>
    

    then set Toolbar's popupTheme to 'PopupTheme' as shown above, just like this:

    ......
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@color/colorPrimary"
        app:navigationIcon="@drawable/arrow_back"
        android:theme="@style/ThemeOverlay.AppCompat.ActionBar"
        app:popupTheme="@style/PopupTheme"
        app:title="@string/toolbar_title"/>
    ......
    

    Cheers!