Android FloatingSearchView

An implementation of a floating view search box and suggestions.

Here are screenshots:

Step 1: Grab it

Add the following in your app/build.gradle:

     implemention 'com.github.arimorty:floatingsearchview:2.1.1'

Step 2: Add to Layout

Then add the following widget in your xml layout

 <com.arlib.floatingsearchview.FloatingSearchView
              android:id="@+id/floating_search_view"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              app:floatingSearch_searchBarMarginLeft="@dimen/search_view_inset"
              app:floatingSearch_searchBarMarginTop="@dimen/search_view_inset"
              app:floatingSearch_searchBarMarginRight="@dimen/search_view_inset"
              app:floatingSearch_searchHint="Search..."
              app:floatingSearch_suggestionsListAnimDuration="250"
              app:floatingSearch_showSearchKey="false"
              app:floatingSearch_leftActionMode="showHamburger"
              app:floatingSearch_menu="@menu/menu_main"
              app:floatingSearch_close_search_on_keyboard_dismiss="true"/>

Step 3: Search

            mSearchView.setOnQueryChangeListener(new FloatingSearchView.OnQueryChangeListener() {
          @Override
          public void onSearchTextChanged(String oldQuery, final String newQuery) {

              //get suggestions based on newQuery

              //pass them on to the search view
              mSearchView.swapSuggestions(newSuggestions);
          }
      });

Styling

You can create a custom style:

        <style name="SearchView">
                <item name="floatingSearch_backgroundColor"></item>
                <item name="floatingSearch_viewSearchInputTextColor"></item>
                <item name="floatingSearch_viewSuggestionItemTextColor"></item>
                <item name="floatingSearch_hintTextColor"></item>
                <item name="floatingSearch_dividerColor"></item>
                <item name="floatingSearch_clearBtnColor"></item>
                <item name="floatingSearch_leftActionColor"></item>
                <item name="floatingSearch_menuItemIconColor"></item>
                <item name="floatingSearch_suggestionRightIconColor"></item>
                <item name="floatingSearch_actionMenuOverflowColor"></item>
        </style>

Full Example

Here is a full example:

(a). activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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"
    tools:context=".MainActivity">

    <com.arlib.floatingsearchview.FloatingSearchView
        android:id="@+id/floating_search_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:floatingSearch_searchBarMarginLeft="5dp"
        app:floatingSearch_searchBarMarginTop="5dp"
        app:floatingSearch_searchHint="Search..."
        app:floatingSearch_suggestionsListAnimDuration="250"
        app:floatingSearch_showSearchKey="false"
        app:floatingSearch_leftActionMode="showHamburger"
        app:floatingSearch_showVoiceInput="true"
        app:floatingSearch_close_search_on_keyboard_dismiss="true"
        app:floatingSearch_menu="@menu/main"
        />
</android.support.constraint.ConstraintLayout>

(b). MainActivity.java

import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Toast;

import com.arlib.floatingsearchview.FloatingSearchView;

public class MainActivity extends AppCompatActivity {

    FloatingSearchView mSearchView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        FloatingSearchView mSearchView = (FloatingSearchView) findViewById(R.id.floating_search_view);

        mSearchView.setOnLeftMenuClickListener(new FloatingSearchView.OnLeftMenuClickListener() {
            @Override
            public void onMenuOpened() {
                Toast.makeText(getApplicationContext(), "Replace with your own action", Toast.LENGTH_LONG).show();
            }

            @Override
            public void onMenuClosed() {
                Toast.makeText(getApplicationContext(), "Replace with your own action", Toast.LENGTH_LONG).show();
            }
        });

        mSearchView.setOnMenuClickListener(new FloatingSearchView.OnLeftMenuClickListener() {
            @Override
            public void onMenuOpened() {

            }

            @Override
            public void onMenuClosed() {

            }
        });
    }
}

Reference

Read more here.
Download code here.
Follow code author here.