自定义外观searchView android

Question

I need to create a custom looking SearchView that opens when an ImageButton, that I already have in my MainActivity.xml, is pressed.

I would really appreciate if you could explain me how to do it, because all I could find on SO was either people not having a custom looking SearchView or having it permanently on their TitleBar which I do not have since I'm using the light.NoTitleBar theme.

This is what I would need it to look like, this is a design I made with photoshop:

Answer 1

You have mutliple ways to obtain what you are looking for in term of design.

A solution i use (wich may not be the best) is to put my EditText (your search field) in a FrameLayout, this way i can have a search button and delete text button overlapping my textView:

XML Example :

<FrameLayout
 android:id="@+id/SearchTextInputLayout"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:layout_gravity="center"
 android:minWidth="100.0dp">
  <EditText
   android:id="@+id/SearchTextInput"
   android:textColorHint="@layout/inputselector"
   android:hint="Search terms here..."
   android:textAppearance="?android:attr/textAppearanceMedium"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   />
    <Button
      android:id="@+id/ClearSearchButton"
      android:layout_width="25dp"
      android:layout_height="25dp"
      android:layout_marginEnd="10dp"
      android:layout_marginRight="10dp"
      android:layout_gravity="end|center_vertical"
      android:background="@android:drawable/ic_delete" />
</FrameLayout>