NestedScrollView and Searchbar

[umtblbl]

Hi friends, I need to create a structure like the following using NestedScrollView and Searchbar. How can I do this, please help me with this.

https://media.giphy.com/media/ihYN7qNcUbisgsjqcW/giphy.gif

 

[wseng92]

I hope is not too late to answer your question.

In your MainActivity, you can use
CoordinatorLayout, which used to include a new layout called app_bar_searchable, and also wrap your recyclerView.

Example

<?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">

    <android.support.design.widget.CoordinatorLayout
        android:id="@+id/coordinatorLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <include
            android:id="@+id/include"
            layout="@layout/app_bar_searchable" />

        <android.support.v4.widget.SwipeRefreshLayout
            android:id="@+id/swipe_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            tools:layout_editor_absoluteX="0dp"
            tools:layout_editor_absoluteY="134dp">

            <android.support.v7.widget.RecyclerView
                android:id="@+id/workRequestRecyclerView"
                android:name="zoinla.com.mypropertytech.fragment.WorkRequestFragment"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:clipToPadding="false"
                android:paddingBottom="@dimen/recyclerview_padding_bottom"
                app:layoutManager="LinearLayoutManager"
                tools:context=".ui.fragment.WorkRequestFragment"
                tools:listitem="@layout/fragment_workrequest" />
        </android.support.v4.widget.SwipeRefreshLayout>
    </android.support.design.widget.CoordinatorLayout>

</android.support.constraint.ConstraintLayout>

Then in your app_bar_searchable, you can design whatever you want it to be looked like.

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.AppBarLayout
        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="wrap_content"
        android:theme="@style/SearchableActionBar">
    <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|enterAlways">
        <android.support.constraint.ConstraintLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@drawable/round_background"
                android:elevation="1dp"
                android:layout_marginTop="@dimen/container_margin_large"
                android:layout_marginStart="@dimen/container_margin_large"
                android:layout_marginEnd="@dimen/container_margin_large"
                android:layout_marginBottom="@dimen/container_margin_tiny">
            <ImageView
                    android:id="@+id/imageView3"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:layout_marginStart="@dimen/container_margin_medium"
                    android:src="@drawable/ic_search_24dp"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"/>
            <EditText
                    android:id="@+id/edtSearchFilter"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:paddingTop="12dp"
                    android:paddingBottom="12dp"
                    android:layout_marginStart="@dimen/container_margin_small"
                    android:textSize="@dimen/text_info"
                    android:textCursorDrawable="@null"
                    android:hint="@string/hint_search"
                    android:background="@null"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toStartOf="@+id/imvClearSearch"
                    app:layout_constraintStart_toEndOf="@+id/imageView3"
                    app:layout_constraintTop_toTopOf="parent"/>
            <ImageView
                    android:id="@+id/imvClearSearch"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingStart="@dimen/container_padding_medium"
                    android:paddingEnd="@dimen/container_padding_medium"
                    android:src="@drawable/ic_close_24dp"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    android:visibility="gone"/>
            <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content" android:src="@drawable/ic_menu_24dp"
                    android:id="@+id/imvLogOut"
                    android:visibility="gone"
                    android:tint="@color/colorTextAccent"
                    android:layout_marginTop="8dp"
                    app:layout_constraintTop_toTopOf="parent" android:layout_marginBottom="8dp"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="@+id/edtSearchFilter" android:layout_marginEnd="8dp"/>
        </android.support.constraint.ConstraintLayout>
    </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>