Display Namelist In Recyclerview under each letter in alphabetic Order Android

Question

I have list of contacts which has to be displayed in alphabetic under each alphabet as shown in the image shown

How can I do this in RecyclerView, please suggest a solut

Answer 1

I'm currently using this. It's very easy to implement, compatible with RecyclerView adapter, and so lightweight you'd barely call it a library!

Answer 2

1. Sort list with data by name
2. Iterate via list with data, and in place when current's item first letter != first letter of next item, insert special kind of object.
3. Inside your Adapter place special view when item is "special".

Answer 3

https://github.com/emilsjolander/StickyListHeaders I hope this is what You want.

Answer 4

compare your model and get first character from title ....

private void getHeaderListLatter(ArrayList<CountriesModel> usersList) {

        Collections.sort(usersList, new Comparator<CountriesModel>() {
            @Override
            public int compare(CountriesModel user1, CountriesModel user2) {
                return String.valueOf(user1.name.charAt(0)).toUpperCase().compareTo(String.valueOf(user2.name.charAt(0)).toUpperCase());
            }
        });

        String lastHeader = "";

        int size = usersList.size();

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

            CountriesModel user = usersList.get(i);
            String header = String.valueOf(user.name.charAt(0)).toUpperCase();

            if (!TextUtils.equals(lastHeader, header)) {
                lastHeader = header;
                mSectionList.add(new CountriesModel(header,true));
            }

            mSectionList.add(user);
        }
    }

and in your adapter getItemViewType Layout like this ....

@Override
    public int getItemViewType(int position) {
        if (mCountriesModelList.get(position).isSection) {
            return SECTION_VIEW;
        } else {
            return CONTENT_VIEW;
        }
    }

for complete reference . https://github.com/sayanmanna/LetterSectionedRecyclerView

Answer 5

This is what I did following @divers's post:

as he mentioned I pass a team list to the the adapter which is sorted and alphabets are added before the next name.

this is he code used to set adapter

void updateUI(ArrayList<TeamMember> teamMembers) {



        adapter = new TeamMemberActivityAdapter(this, addAlphabets(sortList(teamMembers)));
        recList.setAdapter(adapter);
        recList.setVisibility(View.VISIBLE);
        spinningProgressView.setVisibility(View.GONE);
    } 

code to sort the team list obtained from server is given below:

 ArrayList<TeamMember> sortList(ArrayList<TeamMember> list) {
        Collections.sort(list, new Comparator<TeamMember>() {
            @Override
            public int compare(TeamMember teamMember1, TeamMember teamMember2) {
                return teamMember1.getFullname().compareTo(teamMember2.getFullname());
            }
        });
        return list;
    }

while adding alphabets to the list I am setting a type value to know whether its alphabet or team name to check this inside the adapter for showing corresponding layout .the code for that is as shown below:

ArrayList<TeamMember> addAlphabets(ArrayList<TeamMember> list) {
        int i = 0;
        ArrayList<TeamMember> customList = new ArrayList<TeamMember>();  TeamMember firstMember = new TeamMember();
        firstMember.setFullname(String.valueOf(list.get(0).getFullname().charAt(0)));
        firstMember.setType(1);
        customList.add(firstMember);
        for (i = 0; i < list.size() - 1; i++) {
            TeamMember teamMember = new TeamMember();
            char name1 = list.get(i).getFullname().charAt(0);
            char name2 = list.get(i + 1).getFullname().charAt(0);
            if (name1 == name2) {
                list.get(i).setType(2);
                customList.add(list.get(i));
            } else {
                list.get(i).setType(2);
                customList.add(list.get(i));
                teamMember.setFullname(String.valueOf(name2));
                teamMember.setType(1);
                customList.add(teamMember);
            }
        }
        list.get(i).setType(2);
        customList.add(list.get(i));
        return customList;
    }

And finally inside your adapter check if the item is teamMember name or alphabet and display corresponding layout as shown below:

  @Override
    public int getItemViewType(int position) {
        int viewType = 0;
        if (mMembers.get(position).getType() == TYPE_LETTER) {
            viewType = TYPE_LETTER;
        } else if (mMembers.get(position).getType() == TYPE_MEMBER) {
            viewType = TYPE_MEMBER;
        }

        return viewType;
    }

    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {

        LayoutInflater mInflater = LayoutInflater.from(viewGroup.getContext());

        switch (viewType) {
            case TYPE_LETTER:
                ViewGroup vGroupImage = (ViewGroup) mInflater.inflate(R.layout.board_team_letter_item, viewGroup, false);
                ViewHolderLetter image = new ViewHolderLetter(vGroupImage);
                return image;
            case TYPE_MEMBER:
                ViewGroup vGroupText = (ViewGroup) mInflater.inflate(R.layout.board_team_member_item, viewGroup, false);
                ViewHolderMember text = new ViewHolderMember(vGroupText);
                return text;
            default:
                ViewGroup vGroupText2 = (ViewGroup) mInflater.inflate(R.layout.board_team_member_item, viewGroup, false);
                ViewHolderMember text1 = new ViewHolderMember(vGroupText2);
                return text1;

        }
    }

hope this could help you. all the best

Answer 6

You can achieve it with this library.

There is a full example here of how to add headers.

And if you want to implement the search functionality, there is also a full example here, this is the result: