How to group a long list of items on 1 mobile app page?

Question

One of the applications I work on is required to display a long list of items. The list page must display a list of line item labels and their corresponding values. The user can select some of the values to go to a separate page and perform the relevant action, and some of the values are for information purposes (no action required). A lot of the items can be grouped together into 5-6 separate groups. The group names are quite long, longest one is 25 - 29 characters long.

My question is: what is the best way to group the items for Android and iOS? Will an accordion work? Perhaps tabs for each grouping - the long names might be a problem here?

Here is an example of the full list page with no grouping:

Here is a quick example of an accordion:

Here is a quick example of tabs:

Answer 1

Organise them into collapsible groups, user may want to view several groups together.

Tabs are no option, accordion allows only one group to be view at a time.

Answer 2

Design Constraints

• The group names are long therefore they won't fit on one line.
• If you use tabs you won't be able to view more than one grouping at a time.

You have two choices

1. Display the group names and have them work as toggle buttons. Selecting a group name highlights the name and displays the list below. This allows users to easily see their options and display one or more groups at a time.

2. Use an accordion display and allow more than one section to be displayed at the same time. The advantage of the accordion group is that it conforms to expected behavior.

Using the toggle buttons (as mentioned in choice one) has one main advantage - the group choices are never hidden. In an accordion choices may be pushed off the screen.

You will have to test / decide between the two options.