Expandable Recyler View

Expandable Recyler View :-

This example will show how to use expandable recyler view in  your android project.

In my project i am using bignerdranch library for expandable recyler adapter. I am going to show you how can you use this lib to
your project.
This example include the click of the last item that is expanded.You can perform any function on any item click.

You can download that lib from :-

https://github.com/bignerdranch/expandable-recycler-view
Or
compile 'com.bignerdranch.android:expandablerecyclerview:3.0.0-RC1'

1) Create one pojo class like below :-

Question.java  :-
You should implements ParentListItem to model class to make
the class use for recyler adapter.


public class Question implements ParentListItem {

    private List<Answer> answer;
    private String question;

    public Question(String question, List<Answer> answer) {
        this.answer = answer;
        this.question = question;
    }

    @Override
    public List<Answer> getChildItemList() {
        return answer;
    }

    public Answer getChildItemList(int position) {
        return answer.get(position);
    }

    @Override
    public boolean isInitiallyExpanded() {
        return false;
    }

    public String getQuestion() {
        return question;
    }
}


2) Create the header view layout for your adapter.

header.xml :-
This xml file is used to inflate the header view for your recyler adapter.


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

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/row_faq_header_screen_ll_main"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingLeft="@dimen/_20sdp"
        android:paddingRight="@dimen/_20sdp">


        <LinearLayout
            android:id="@+id/row_faq_header_screen_ll_inputMain"
            style="@style/InputLinearLayout"
            android:background="@drawable/faq_header_text_border"
            android:layout_marginBottom="0dp">

            <CustomTextView
                android:id="@+id/row_faq_header_screen_tv_question_text"
                style="@style/InputEditText"
                android:hint="@string/email"
                android:textSize="@dimen/_11sdp"
                />

            <ImageView
                android:id="@+id/row_faq_header_screen_iv_imageArrow"
                style="@style/InputImageView"
                android:src="@drawable/ic_arrow_detail" />

        </LinearLayout>

   </LinearLayout>
</layout>

3) Create the child view layout for your adapter.

child.xml :-
This xml file is used to inflate the child view for your recyler adapter.


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

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/row_faq_child_screen_ll_main"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:paddingLeft="@dimen/_30sdp"
        android:paddingRight="@dimen/_30sdp">


        <CustomTextView
            android:id="@+id/row_faq_child_screen_tv_text"
            android:padding="@dimen/_10sdp"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/black_transparent"
            android:text="sbd sdbakbdn jksbdjkabsnjksbdk kjkbsd jkasjkabs dajkb as jkasjks bjk asjkas jkbjks kjb jksb djkasbjkssjkbjkabbskabkabks"
            android:textColor="@color/white"
            android:textSize="@dimen/_9sdp"
            app:font_type="@string/font_openSansRegular.ttf" />

    </LinearLayout>
</layout>


4) Create the main layout that will hold the recyler view.

faq.xml :-
This xml file is used to hold the main recyler view.
<layout>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/ic_signin_bg">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="?attr/actionBarSize"
            android:clickable="true"
            android:orientation="vertical">


            <android.support.v7.widget.RecyclerView
                android:id="@+id/faq_rv_faqList"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />

            <CustomTextView
                android:id="@+id/faq_tv_nodataText"
                style="@style/TextView_Regular"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center"
                android:gravity="center"
                android:text="@string/nodatafaq"
                android:textSize="@dimen/_20sdp"
                android:visibility="gone"
                app:font_type="@string/font_openSansRegular.ttf" />

        </LinearLayout>
    </LinearLayout>
</layout>

5) Create the Faq.java class.

Faq.java

public class FAQFragment extends Fragment{

    private FragmentFaqScreenBinding mBinding;
    private ActivityHomeMainBinding mainHomeBinding;
    private ArrayList<Question> question = new ArrayList<>();
    private ArrayList<String> answer = new ArrayList<>();
    private FaqAdapter mAdapter;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

        mBinding = DataBindingUtil.inflate(inflater, R.layout.fragment_faq_screen, container, false);
        ButterKnife.bind(this, mBinding.getRoot());
        return mBinding.getRoot();
    }

    @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        setToolbar();
        setAdapter();
    }


    private void setAdapter() {

// Add the data to your arrayList.

        String mystring = "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).";
        Answer answer = new Answer(mystring);
        ArrayList myArry = new ArrayList<Answer>();
        myArry.add(answer);
        Question question1 = new Question("What is it about ?", myArry);
        question.add(question1);
        question1 = new Question("What is it working for ?",myArry);
        question.add(question1);
        question1 = new Question("What kind of dishes i can prepare ?",myArry);
        question.add(question1);


// Set the adapter for your recyler view.

        mAdapter = new FaqAdapter(getContext(), question);

// get the click of last exapanded item

        mAdapter.setExpandCollapseListener(new ExpandableRecyclerAdapter.ExpandCollapseListener() {
            @Override
            public void onListItemExpanded(int i) {
                mAdapter.notifyParentItemChanged(i);
            }

            @Override
            public void onListItemCollapsed(int i) {
                mAdapter.notifyParentItemChanged(i);
            }
        });
        mBinding.faqRvFaqList.setLayoutManager(new LinearLayoutManager(getContext()));
        mBinding.faqRvFaqList.setAdapter(mAdapter);
    }

    }
}


6) Create the adapter class for your recyler view.

FaqAdapter.java :-

public class FaqAdapter extends ExpandableRecyclerAdapter<FaqAdapter.MyParentViewHolder, FaqAdapter.MyChildViewHolder> {
    private Context context;

    public FaqAdapter(Context context, @NonNull List parentItemList) {
        super(parentItemList);
        this.context = context;
    }


    @Override
    public MyParentViewHolder onCreateParentViewHolder(ViewGroup viewGroup) {
        View view = LayoutInflater.from(context).inflate(R.layout.row_faq_header_screen, viewGroup, false);
        return new MyParentViewHolder(view);
    }

    @Override
    public MyChildViewHolder onCreateChildViewHolder(ViewGroup viewGroup) {
        View view = LayoutInflater.from(context).inflate(R.layout.row_faq_child_screen, viewGroup, false);
        return new MyChildViewHolder(view);
    }

    public Object getListItemObject(int position) {
        return super.getListItem(position);
    }

    @Override
    public void onBindParentViewHolder(final MyParentViewHolder myParentViewHolder, int i, ParentListItem parentListItem) {
        Question question = (Question) parentListItem;
        myParentViewHolder.setQuestion(question);

    }

    @Override
    public void onBindChildViewHolder(MyChildViewHolder myChildViewHolder, int i, Object o) {
        Answer answer = (Answer) o;
        myChildViewHolder.setAnswer(answer);
    }


    // For parent view
    public class MyParentViewHolder extends ParentViewHolder {

        private RowFaqHeaderScreenBinding mBindingParentView;

        public MyParentViewHolder(View itemView) {
            super(itemView);
            mBindingParentView = DataBindingUtil.bind(itemView);
        }

        public void setQuestion(Question question) {
            if (isExpanded())
                mBindingParentView.rowFaqHeaderScreenIvImageArrow.setImageResource(R.drawable.ic_dropdown_arrow_down);
            else
                mBindingParentView.rowFaqHeaderScreenIvImageArrow.setImageResource(R.drawable.ic_arrow_detail);
            mBindingParentView.rowFaqHeaderScreenTvQuestionText.setText(question.getQuestion());
        }
    }


    //For child view
    public class MyChildViewHolder extends ChildViewHolder {

        private RowFaqChildScreenBinding mBindingChildView;

        public MyChildViewHolder(View itemView) {
            super(itemView);
            mBindingChildView = DataBindingUtil.bind(itemView);
        }

        public void setAnswer(Answer answer) {
            mBindingChildView.rowFaqChildScreenTvText.setText(answer.getAnswer());
        }
    }
}


Output :-