Search code examples
androidandroid-layoutandroid-toolbarsearchview

How can I put a SearchView inside of a ToolBar with a height set to wrap_content without it disappearing?


I've noticed that if I place an android.support.v7.widget.SearchView inside of an android.support.v7.widget.Toolbar with its height set to wrap_content that the SearchView behaves very strangely. It appears fine at first but then as soon is it gains focus it disappears and no longer takes up space in a layout. This can be resolved by setting an explicit height to the Toolbar but I'm trying to use wrap_content specifically because my use-case requires the Toolbar to resize dynamically.

It might also be worth mentioning that the SearchView is still functional after it disappears. If I add a SearchView.OnQueryTextListener to the SearchView then I can observe that the query text is indeed being updated as I type. Neither this text nor any other part of the SearchView takes up space in the layout though and if you force it to be unobscured in the layout then it is still not visible.

This kind of seems like a bug in SearchView to me. Does anybody have some more insight into why it's happening or how to work around it?

Here's a working example of the issue:

<?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="com.me.MyActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="@dimen/appbar_padding_top"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/AppTheme.PopupOverlay">

            <android.support.v7.widget.SearchView
                android:id="@+id/internalSearchView"
                app:queryHint="To..."
                android:layout_weight="1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" >
            </android.support.v7.widget.SearchView>

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

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

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

Solution

  • It certainly looks like it should work... I have two suggestions.

    1. If it doesn't interfere with your design goals, set android:minHeight="?attr/actionBarSize" on your toolbar. This may be desired anyway.
    2. Try setting android:layout_height="48dp" on the SearchView.