Expandable listΒΆ

desktopicon mobileicon
  • The expandable list is useful when additional details for individual elements in a list/group are to be shown alongside the other elements in the list
  • For example, use the expandable list pattern for a list of emails in a thread to allow the user to show long individual mails in full while retaining easy navigation through the whole thread
  • Make only list items that are higher than 1/4 of the visible list height expandable
  • Tapping an expandable list element once expands it, tapping it again collapses it
  • Add enough free space at the beginning and end of the list to allow users to scroll both the first and last item on the list to the center of the screen for easy interaction with it.