Search code examples
javaandroidandroid-toolbarsearchview

Left space in Toolbar with SearchView android studio

I'm trying to add a simple SearchView to the toolbar in my app. Everything it's working fine expect for the layout.

There is this "space" between the NavigationDrawer icon and the SearchView. If I set a title the space is filled with that string, otherwise is empty.

Empty string:

enter image description here

With a string in title:

enter image description here

How do I remove that annoying empty space?

Edit:

I'm using as base code the NavigationDrawer example from Android Studio

main.xml

    <menu 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"
    tools:context=".MainActivity"
    >

    <item
        android:id="@+id/action_search"
        android:icon="@android:drawable/ic_menu_search"
        android:title="Search"
        app:actionViewClass="android.support.v7.widget.SearchView"
        app:showAsAction="always" />

    </menu>

app_bar_main.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:fitsSystemWindows="true"
    tools:context="ga.musicforyou.musicforyou.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
       >

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            app:contentInsetEnd="0dp"
            app:contentInsetStart="0dp"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            />

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


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

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <include
        layout="@layout/app_bar_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        app:theme="@style/ThemeOverlay.AppCompat.Dark"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:itemTextColor="#FFF"
        app:itemIconTint="#FFF"

        app:menu="@menu/activity_main_drawer" />

</android.support.v4.widget.DrawerLayout>
Solution

  • Toolbar extends from FrameLayout and you can put views inside it. Like this:

    <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/toolbar"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/primary_color">

<SearchView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

</android.support.v7.widget.Toolbar>

    Edit: You put it inside the layout as a menu. It always will be on the right side of the toolbar, because it is a menu. If you want to have a more direct control over views inside a toolbar, just put it there as I did show you.