The filter feedback bar is a horizontal bar that appears above a list of content. It uses interactive buttons to communicate which filters have been applied to the list and allows users to quickly apply frequently used filters. It is typically used in list report or work list floorplans.

Usage

• Use a filter feedback bar when there are frequently used filter options.
• Use a filter feedback bar when users need to interact with filters that have been applied to a list.

Don’t use a filter feedback bar when there are many filters that need to be applied to the list or if the filters have complex names. Use the count as feedback in the filter button instead.

Anatomy

The filter feedback bar sits below the navigation bar and, if available, beneath the search bar, positioned directly above the content area.

Filter Buttons

There are two types of filter buttons in the filter feedback bar.

A. Active Filter Buttons

Active filter buttons are those that have been selected. They indicate a sort button (if it is a non-default sort) and the filters currently applied to the list. They are always placed to the left of any visible inactive filter buttons.

B. Inactive Filter Buttons

Inactive filter buttons will only appear in the filter bar for fast filters that are not currently selected by the user. More information on fast filters can be found in the Types section below.

Behavior and Interaction

Horizontal Scrolling

Users can scroll the filter feedback bar horizontally to view any additional buttons that may be off-screen. If the sort button is present, the filter buttons slide beneath it when scrolling.

Applying Fast Filters

When the user taps a fast filter button, it is applied to the content list and its button takes on active status.

Removing Filters

To remove a filter, users can tap on its active filter button in the filter feedback bar or deselect it within the filter modal window. Fast filters remain in the filter feedback bar even when inactive, whereas standard filters disappear from the filter feedback bar when deactivated.

Applying Filters from the Filter Modal

When the user selects a filter from the filter modal window, it is applied to the content list and an active filter button appears on the left side of the filter feedback bar (to the right of the sort button, if available).

Variations

Filter Feedback Bar with Fast Filters

Fast filters are buttons that remain visible in the filter feedback bar even when they are not currently applied to the content list below. They provide users with quick access to the most frequently used filter options. It is up to you to define which filters should be included as fast filters – users cannot customize them within the app.

Filter Feedback Bar Without Fast Filters

When there are no fast filters predefined for the app, the filter feedback bar is hidden by default. It only appears after the user has either applied a filter or changed the sort option within the filter modal. Only new sorts are available in the filter feedback bar. Please note that default sort does not appear in the filter feedback bar.

Resources

Development: FUIFilterFeedbackControl

SAP Fiori for Android: Filter Feedback Bar

Related Components/Patterns: Sort and Filter