Intro

The standard list item is used for less complex data sets, such as when the user selects an item in a dialog. It consists of an optional image, a title, description, and a single info text, which can contain semantic information.

Standard list item
Standard list item

Usage

Use the standard list item if:

  • You want to display a simple set of data within a select dialog.
  • You want to display a simple set of data in the master list which does not involve objects. (For objects, you should use the object list item.)

Responsiveness and Adaptiveness

The standard list item can contain an icon (in the form of an image or from the SAP icon font), a title (left-aligned), a short description (left-aligned below the title), and a semantic info text (right-aligned next to the description).

 

The title and description truncate and do not wrap. The info does not wrap or truncate, so it causes the title or description (when used) to truncate. Therefore, try to keep all texts as short as possible and only as long as is really necessary to understand the content.

Standard list item with semantic colored info
Standard list item with semantic colored info

By default, the title font is larger if the description is empty. If you have list items with and without a description, this results in differently sized titles, which makes it harder to read. In this case, you should switch off the title size adaptation (AdaptTitleSize).

Standard list item with image and adapted title
Standard list item with image and adapted title

Behavior and Interaction

List item behavior and interaction is similar for all list item variants and is therefore described in the list overview article.

Resources

Want to dive deeper? Follow the links below to find out more about related controls, the SAPUI5 implementation, and the visual design.

Elements and Controls

Implementation