Implementing an adapter for RecyclerView in Android

Question

I am trying to implement the flexible space with image pattern of the material design.

In order to do so, I followed this tutorial .

The problem is, the tutorial uses RecyclerView , and I have another view I'd like to use which is just a simple ScrollView with a relative view:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingLeft="20dp"
        android:paddingRight="20dp" >

        <TextView
            android:id="@+id/loggedInTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_below="@+id/separator1"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="15dp"
            android:text="@string/profile_logged_in_with_title"
            android:textSize="18sp" />

        <ImageView
            android:id="@+id/loggedInPlatformLogo"
            android:layout_width="95dp"
            android:layout_height="30dp"
            android:layout_alignBottom="@+id/loggedInTitle"
            android:layout_centerHorizontal="true"
            android:layout_marginBottom="-4dp"
            android:layout_marginLeft="30dp"
            android:layout_toRightOf="@+id/loggedInTitle"
            android:background="@drawable/facebook_logo"
            android:gravity="center_horizontal|center_vertical" />

        <View
            android:id="@+id/separator2"
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:layout_alignLeft="@+id/separator1"
            android:layout_below="@+id/loggedInTitle"
            android:layout_marginTop="17dp"
            android:background="@android:color/darker_gray" />

        <ImageView
            android:id="@+id/homeIcon"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:layout_alignLeft="@+id/loggedInTitle"
            android:layout_below="@+id/separator2"
            android:layout_marginTop="10dp"
            android:background="@drawable/home_icon" />

        <TextView
            android:id="@+id/homeTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/homeIcon"
            android:layout_marginBottom="4dp"
            android:layout_marginLeft="15dp"
            android:layout_toRightOf="@+id/homeIcon"
            android:text="@string/profile_home_title"
            android:textSize="18sp"
            android:textStyle="bold" />

        <AutoCompleteTextView
            android:id="@+id/homeAddressEdit"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignLeft="@+id/homeIcon"
            android:layout_below="@+id/homeIcon"
            android:layout_marginTop="2dp"
            android:ems="10"
            android:hint="@string/profile_home_address_hint"
            android:inputType="textAutoComplete"
            android:textSize="16sp" />

        <View
            android:id="@+id/separator3"
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:layout_alignLeft="@+id/separator1"
            android:layout_below="@+id/homeAddressEdit"
            android:layout_marginTop="8dp"
            android:background="@android:color/darker_gray" />

        <ImageView
            android:id="@+id/workIcon"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:layout_alignLeft="@+id/homeIcon"
            android:layout_below="@+id/separator3"
            android:layout_marginTop="10dp"
            android:background="@drawable/work_icon" />

        <TextView
            android:id="@+id/workTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/workIcon"
            android:layout_marginBottom="4dp"
            android:layout_marginLeft="15dp"
            android:layout_toRightOf="@+id/workIcon"
            android:text="@string/profile_work_title"
            android:textSize="18sp"
            android:textStyle="bold" />

        <AutoCompleteTextView
            android:id="@+id/workAddressEdit"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignLeft="@+id/workIcon"
            android:layout_below="@+id/workIcon"
            android:layout_marginTop="2dp"
            android:ems="10"
            android:hint="@string/profile_work_address_hint"
            android:inputType="textAutoComplete"
            android:textSize="16sp" />

        <View
            android:id="@+id/separator4"
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:layout_alignLeft="@+id/separator1"
            android:layout_below="@+id/workAddressEdit"
            android:layout_marginTop="8dp"
            android:background="@android:color/darker_gray" />

        <ImageView
            android:id="@+id/privacyIcon"
            android:layout_width="30dp"
            android:layout_height="30dp"
            android:layout_alignLeft="@+id/workIcon"
            android:layout_below="@+id/separator4"
            android:layout_marginTop="13dp"
            android:background="@drawable/privacy_icon" />

        <TextView
            android:id="@+id/privacyTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/privacyIcon"
            android:layout_marginBottom="4dp"
            android:layout_marginLeft="15dp"
            android:layout_toRightOf="@+id/privacyIcon"
            android:text="@string/profile_privacy_title"
            android:textSize="18sp"
            android:textStyle="bold" />

        <Spinner
            android:id="@+id/privacySpinner"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignLeft="@+id/privacyIcon"
            android:layout_below="@+id/privacyIcon"
            android:layout_marginBottom="4dp"

            android:layout_marginTop="-3dp"
            android:entries="@array/profile_privacy_settings"
            android:prompt="@string/profile_privacy_title" />

    </RelativeLayout>
</ScrollView>

So I tried to replace the RecyclerView in the tutorial's layout xml with a reference to this view, but the result is I can't scroll the view. I guess that's because ScrollView is not compatible with the flexible space pattern .

Next attempt was trying to convert the above ScrollView layout to an adapter in order to use RecyclerView following this Android Developers example , but I have no idea how to do that, since I got too many elements to combine and the example consists of simple array of Strings.

I'd really appreciate a sample of how the Adapter should look like in order to match the layout above, or another easier solution (maybe RecyclerView isn't the best direction), if it exists.

Answer 1

There's a design support library from Google. Try this website: http://hmkcode.com/material-design-app-android-design-support-library-appcompat/