Add EditText to Toolbar

user2456977 picture user2456977 · May 1, 2015 · Viewed 38.6k times · Source

My Toolbar and EditText look like this:

enter image description here

I tried adding it as an ActionView but I got this result:

enter image description here

It basically just added my words 'Tap Below' as a title without the TextView

Here's what I did:

menu.xml

<menu>
    ... 
    ...
    <item
        android:id="@+id/edit_text_menu"
        android:orderInCategory="300"
        android:title="Tap Below"
        android:actionLayout="@layout/edit_text_layout"
        app:showAsAction="ifRoom|collapseActionView"
        />
</menu>

edit_text_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<EditText xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/myEditText"
    android:background="#000000">

</EditText>

I thought by doing this I add my EditText layout to the Toolbar... Can someone please help?

Alternatively, is there a trick where I can overlay the EditText on the Toolbar?

I tried adding <item name="windowActionModeOverlay">true</item> but it didn't do anything.

Answer

Jared Burrows picture Jared Burrows · May 1, 2015

Just add the EditText to the XML for your ToolBar. That is probably the easiest way.

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light">
      <EditText
         android:layout_width="match_parent"
         android:layout_height="match_parent"
         android:id="@+id/myEditText"
         android:background="#000000" />
</android.support.v7.widget.Toolbar>