Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Android Persistent Search Bar in Toolbar

I am fairly new to Android development. I went through the Google Udacity course and am currently trying to code an app. Specifically, I'm trying to switch over my current app (written in QT) to native Android.

What I am trying to do is making something similar to this:

http://i.stack.imgur.com/Exm2y.png

Which was taken from the Material Design - Persistent search, with navigation drawer question on the User Experience Stack Exchange.

I can do the top part, but I cannot figure out how to get the persistent search bar at the bottom. I've been trying different solutions (custom theme for activitybar and toolbar), but have not been able to get something even remotely close. Could someone help me out with this?

like image 335
nerras Avatar asked Jan 28 '16 17:01

nerras


People also ask

How do I add a search bar to my ToolBar?

Add the Search View to the App Bar To add a SearchView widget to the app bar, create a file named res/menu/options_menu. xml in your project and add the following code to the file. This code defines how to create the search item, such as the icon to use and the title of the item.

What is the material search?

Search allows users to quickly locate content across an app. Basic search enables users to input a query into a search text field to view related results. Search query input methods can be extended to include historical suggestions, auto-completion of queries, and voice input.


1 Answers

just need to put all together inside AppBarLayout. Toolbar and any library for persisten search. Here is very useful, so finally set your layout_height for AppBarLayout. something like this

<android.support.design.widget.AppBarLayout
    android:id="@id/app_bar_layout"
    android:layout_width="match_parent"
    android:layout_height="@dimen/margin_130"
    android:background="@drawable/bg_tab_degraded"
    android:theme="@style/ThemeOverlay.AppCompat.Dark">

    <android.support.v7.widget.Toolbar
        android:id="@id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="@drawable/bg_tab_degraded"
        app:layout_scrollFlags="scroll|enterAlways"
        />

    <com.arlib.floatingsearchview.FloatingSearchView
        android:id="@+id/floating_search_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/bg_tab_degraded"
        app:floatingSearch_searchBarMarginLeft="@dimen/margin_20"
        app:floatingSearch_searchBarMarginTop="@dimen/margin_5"
        app:floatingSearch_searchBarMarginRight="@dimen/margin_20"
        app:floatingSearch_searchHint="Search..."
        app:floatingSearch_suggestionsListAnimDuration="250"
        app:floatingSearch_showSearchKey="false"
        app:floatingSearch_leftActionMode="showSearch"
        app:floatingSearch_menu="@menu/main"
        app:floatingSearch_close_search_on_keyboard_dismiss="true"/>



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

I hope, It will help you. Good luck.

like image 178
user1153174 Avatar answered Oct 20 '22 12:10

user1153174