addHeaderView in RecyclerView

As we all know there is addHeaderView in ListView to add header item. But there is no equivalent to this in RecyclerView. Here i am sharing short demo for addHeaderView in RecyclerView.

add dependency in build.gradle

compile 'com.android.support:recyclerview-v7:23.1.1'

1	compile 'com.android.support:recyclerview-v7:23.1.1'

add RecyclerView in your main xml

<android.support.v7.widget.RecyclerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/list_recylclerview"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<android.support.v7.widget.RecyclerView

xmlns:android="http://schemas.android.com/apk/res/android"

android:id="@+id/list_recylclerview"

android:layout_width="match_parent"

android:layout_height="match_parent" />

row_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#E5E5E5"
    android:padding="20dp">

    <TextView
        android:id="@+id/title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Android Gig"
        android:textSize="18dp" />

    <TextView
        android:id="@+id/decription"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/title"
        android:textSize="14dp" />
</RelativeLayout>

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:background="#E5E5E5"

android:padding="20dp">

<TextView

android:id="@+id/title"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Android Gig"

android:textSize="18dp" />

<TextView

android:id="@+id/decription"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_below="@id/title"

android:textSize="14dp" />

</RelativeLayout>

header.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/header_photo"
        android:src="@drawable/ic_launcher"
        android:layout_centerHorizontal="true"/>

    <TextView android:layout_below="@+id/header_photo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Android Gig"
        android:layout_marginTop="5dp"
        android:layout_centerHorizontal="true"
        android:textStyle="bold"
        android:textAppearance="?android:attr/textAppearanceLarge" />

</RelativeLayout>

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:orientation="vertical" android:layout_width="match_parent"

android:layout_height="match_parent"

android:padding="10dp">

<ImageView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:id="@+id/header_photo"

android:src="@drawable/ic_launcher"

android:layout_centerHorizontal="true"/>

<TextView android:layout_below="@+id/header_photo"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Android Gig"

android:layout_marginTop="5dp"

android:layout_centerHorizontal="true"

android:textStyle="bold"

android:textAppearance="?android:attr/textAppearanceLarge" />

</RelativeLayout>

Here is the code for your adapter class

public class CommentAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
    private static final int TYPE_HEADER = 0;
    private static final int TYPE_ITEM = 1;
    String[] data;

    public CommentAdapter(String[] data) {
        this.data = data;
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        if (viewType == TYPE_ITEM) {
            View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.row_layout, parent, false);
            return new VHItem(v);
        } else if (viewType == TYPE_HEADER) {
            View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.header, parent, false);
            return new VHHeader(v);
        }

        throw new RuntimeException("there is no type that matches the type " + viewType + " + make sure your using types correctly");
    }

    @Override
    public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
        if (holder instanceof VHItem) {
            String dataItem = getItem(position);
            //cast holder to VHItem and set data
            ((VHItem) holder).description.setText(dataItem);
        } else if (holder instanceof VHHeader) {
            //cast holder to VHHeader and set data for header.
        }
    }

    @Override
    public int getItemCount() {
        return data.length + 1;
    }

    @Override
    public int getItemViewType(int position) {
        if (isPositionHeader(position))
            return TYPE_HEADER;

        return TYPE_ITEM;
    }

    private boolean isPositionHeader(int position) {
        return position == 0;
    }

    private String getItem(int position) {
        return data[position - 1];
    }

    class VHItem extends RecyclerView.ViewHolder {
        TextView description;

        public VHItem(View itemView) {
            super(itemView);
            description=(TextView)itemView.findViewById(R.id.decription);
        }
    }

    class VHHeader extends RecyclerView.ViewHolder {

        public VHHeader(View itemView) {
            super(itemView);
        }
    }
}

public class CommentAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {

private static final int TYPE_HEADER = 0;

private static final int TYPE_ITEM = 1;

String[] data;

public CommentAdapter(String[] data) {

this.data = data;

}

@Override

public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

if (viewType == TYPE_ITEM) {

View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.row_layout, parent, false);

return new VHItem(v);

} else if (viewType == TYPE_HEADER) {

View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.header, parent, false);

return new VHHeader(v);

}

throw new RuntimeException("there is no type that matches the type " + viewType + " + make sure your using types correctly");

}

@Override

public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {

if (holder instanceof VHItem) {

String dataItem = getItem(position);

//cast holder to VHItem and set data

((VHItem) holder).description.setText(dataItem);

} else if (holder instanceof VHHeader) {

//cast holder to VHHeader and set data for header.

}

@Override

public int getItemCount() {

return data.length + 1;

}

@Override

public int getItemViewType(int position) {

if (isPositionHeader(position))

return TYPE_HEADER;

return TYPE_ITEM;

}

private boolean isPositionHeader(int position) {

return position == 0;

}

private String getItem(int position) {

return data[position - 1];

}

class VHItem extends RecyclerView.ViewHolder {

TextView description;

public VHItem(View itemView) {

super(itemView);

description=(TextView)itemView.findViewById(R.id.decription);

}

class VHHeader extends RecyclerView.ViewHolder {

public VHHeader(View itemView) {

super(itemView);

}

ItemDecoration.java for adding divider in RecyclerView

public class DividerItemDecoration extends RecyclerView.ItemDecoration {

    private Drawable mDivider;

    public DividerItemDecoration(Context context) {
        mDivider = context.getResources().getDrawable(R.drawable.line_divider);
    }

    @Override
    public void onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state) {
        int left = parent.getPaddingLeft();
        int right = parent.getWidth() - parent.getPaddingRight();

        int childCount = parent.getChildCount();
        for (int i = 0; i < childCount; i++) {
            View child = parent.getChildAt(i);

            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();

            int top = child.getBottom() + params.bottomMargin;
            int bottom = top + mDivider.getIntrinsicHeight();

            mDivider.setBounds(left, top, right, bottom);
            mDivider.draw(c);
        }
    }
}

public class DividerItemDecoration extends RecyclerView.ItemDecoration {

private Drawable mDivider;

public DividerItemDecoration(Context context) {

mDivider = context.getResources().getDrawable(R.drawable.line_divider);

}

@Override

public void onDrawOver(Canvas c, RecyclerView parent, RecyclerView.State state) {

int left = parent.getPaddingLeft();

int right = parent.getWidth() - parent.getPaddingRight();

int childCount = parent.getChildCount();

for (int i = 0; i < childCount; i++) {

View child = parent.getChildAt(i);

RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) child.getLayoutParams();

int top = child.getBottom() + params.bottomMargin;

int bottom = top + mDivider.getIntrinsicHeight();

mDivider.setBounds(left, top, right, bottom);

mDivider.draw(c);

}

line_divider.xml for custom divider of RecyclerView

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <size
        android:width="0dp"
        android:height="10dp" />

    <solid android:color="@android:color/white" />

</shape>

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android"

android:shape="rectangle">

<size

android:width="0dp"

android:height="10dp" />

</shape>

Finally initialize RecyclerView in your MainActivity and set adapter for it.

RecyclerView mRecyclerView = (RecyclerView)findViewById(R.id.list_recylclerview);
mRecyclerView.addItemDecoration(new DividerItemDecoration(this));

LinearLayoutManager mLayoutManager = new LinearLayoutManager(this);
mRecyclerView.setLayoutManager(mLayoutManager);
mRecyclerView.setItemAnimator(new DefaultItemAnimator());

String comments[]=new String[6];
comments[0]="Android Runtime Permission";
comments[1]="Inbox Style Notification Like Whatsapp";
comments[2]="Part of TextView clickable";
comments[3]="YouTube Integration with Android Studio";
comments[4]="Floting Labels : Text Input Layout";
comments[5]="Snackbar, Bye Bye Toast!";

CommentAdapter mAdapter = new CommentAdapter(comments);
mRecyclerView.setAdapter(mAdapter);

RecyclerView mRecyclerView = (RecyclerView)findViewById(R.id.list_recylclerview);

mRecyclerView.addItemDecoration(new DividerItemDecoration(this));

LinearLayoutManager mLayoutManager = new LinearLayoutManager(this);

mRecyclerView.setLayoutManager(mLayoutManager);

mRecyclerView.setItemAnimator(new DefaultItemAnimator());

String comments[]=new String[6];

comments[0]="Android Runtime Permission";

comments[1]="Inbox Style Notification Like Whatsapp";

comments[2]="Part of TextView clickable";

comments[3]="YouTube Integration with Android Studio";

comments[4]="Floting Labels : Text Input Layout";

comments[5]="Snackbar, Bye Bye Toast!";

CommentAdapter mAdapter = new CommentAdapter(comments);

mRecyclerView.setAdapter(mAdapter);

addHeaderView in RecyclerView

Author
Recent Posts

Follow me

Ravi Rupareliya

He is author of Android Gig. He loves to explore new technologies and have worked on Android, React Native, Action on Google and Flutter.

addHeaderView in RecyclerView

Ravi Rupareliya

Latest posts by Ravi Rupareliya (see all)