Android searchview layout not set in correct position

I'm working on my android app to build a custom searchview. I'm having a problem with the layout because I can't be able to get the back button to go on the left, the search edit text to go on the middle and the clear button to go on the right.

Here is what it show:

It should look like this:

Here is the 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/action_search"
        android:icon="@drawable/ic_search_white_24dp"
        android:title=""
        app:actionLayout="@layout/search_view"
        app:showAsAction="ifRoom|collapseActionView" />

</menu>

Here is the search_view:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/search_container"
    android:layout_width="match_parent"
    android:layout_height="?android:attr/actionBarSize"
    android:orientation="horizontal">

    <ImageButton
        android:id="@+id/backButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent"
        android:src="@drawable/ic_arrow_back_grey_24dp" />

    <EditText
        android:id="@+id/searchEditText"
        android:layout_width="match_parent"
        android:layout_height="56dp"
        android:layout_weight="1"
        android:background="@android:color/transparent"
        android:hint="Search Mail"
        android:imeOptions="actionSearch"
        android:inputType="text"
        android:maxLines="1"
        android:paddingLeft="2dp"
        android:singleLine="true"
        android:textColor="@color/default_textColor"
        android:textColorHint="@color/default_textColorHint"
        android:textSize="16sp" />

    <!--<ImageButton
        android:id="@+id/voiceButton"
        style="@style/SearchViewIcon"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:contentDescription="@string/action_voice_search"
        android:visibility="gone"
        app:layout_constraintEnd_toEndOf="parent"
        app:srcCompat="@drawable/ic_voice_search_black_24dp" />-->

    <ImageButton
        android:id="@+id/clearButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@android:color/transparent"
        android:scaleType="fitCenter"
        android:src="@drawable/ic_baseline_close_24" />
</LinearLayout>

Here is the app_bar_main:

<?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout 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">


        <com.google.android.material.appbar.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/Theme.MyLogin.AppBarOverlay">

            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="?attr/colorPrimary"
                app:collapseIcon="@drawable/ic_arrow_back_grey_24dp" />
         </com.google.android.material.appbar.AppBarLayout>

         <include layout="@layout/content_main2" />
    </RelativeLayout>

Here is the mainactivity:

Toolbar toolbar;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main2);
    toolbar = findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);
}


@Override
public boolean onCreateOptionsMenu(Menu menu) {
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.main, menu);

    mSearchItem = menu.findItem(R.id.action_search);

    MenuItemCompat.setOnActionExpandListener(mSearchItem, new MenuItemCompat.OnActionExpandListener() {
        @Override
        public boolean onMenuItemActionCollapse(MenuItem item) {
            // Called when SearchView is collapsing
            if (mSearchItem.isActionViewExpanded()) {
                animateSearchToolbar(1, false, false);
            }
            return true;
        }

        @Override
        public boolean onMenuItemActionExpand(MenuItem item) {
            // Called when SearchView is expanding
            animateSearchToolbar(1, true, true);
            return true;
        }
    });

    return true;
}

Can you please show me an example how I can get the backbutton to go on the left side, searchEditText to go on the middle and clearButton to go on the right side??

I have made some changes in your layout it should look proper now. check below,

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/search_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    >

    <ImageButton
        android:id="@+id/backButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/dp_20"
        android:background="@android:color/transparent"
        android:src="@drawable/ic_back_arrow" />

    <EditText
        android:id="@+id/searchEditText"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="@android:color/transparent"
        android:hint="Search Mail"
        android:layout_margin="@dimen/dp_20"
        android:imeOptions="actionSearch"
        android:inputType="text"
        android:maxLines="1"
        android:paddingLeft="2dp"
        android:singleLine="true"
        android:textSize="16sp" />

    <ImageButton
        android:id="@+id/clearButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="@dimen/dp_20"
        android:background="@android:color/transparent"
        android:scaleType="fitCenter"
        android:src="@drawable/ic_back_arrow" />
</LinearLayout>

Changes I made: add margin to look proper, set editText width to 0dp to fit it in middle of both imageButton. This should fix your problem. Let me know if you have doubt. consider upvotting if it helps. Cheers!!