Skip to content

The Filter Form Cell

The filter form cell allows the user to select multiple values from a group of values. The values are either displayed using Material Design Chips or a collection of check boxes.

Placement

By default, chips are displayed on a single line that scrolls horizontally:

Filter chips

Filter chips scrolling horizontally

The chips can also wrap on to multiple lines:

Multi-line filter chips

The boolean attribute singleLine determines how the chips are placed.

Values can also be displayed using check boxes. Check boxes may be a better choice when:

  • The labels for values are long.
  • The selections have a certain semantic order.
  • There are more than 10 values to select from.

Filter checkboxes

The boolean attribute useChips determines if chips or check boxes are displayed.

Appearance

By default, chips are displayed with a filled background:

Filled chip

Chips can also be displayed with an outlined border:

Outlined chip

The boolean attribute outlined determines if chips are outlined.

Using Filter Form Cell

The filter form cell can be placed within your activity like any traditional Android view:

<com.sap.cloud.mobile.fiori.formcell.FilterFormCell
    android:id="@+id/filterFormCell"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:entries="@array/tabValuesArray"
    app:key="Multi line"
    app:outlined="true"
    app:singleLine="false"
    app:errorEnabled="true"
    app:value="@array/filter_for_cell_values_1" />

Callback Mechanism

The filter form cell supports callback listeners, such as OnCellChangeListener<List<Integer>>, to notify the application of changes to the selected choice.

The OnCellChangeListener<List<Integer>> callback is called whenever a chip or checkbox is selected:

FilterFormCell cell = findViewById(R.id.filterFormCell;
cell.setCellValueChangeListener(new FormCell.CellValueChangeListener<List<Integer>>() {
    @Override
    public void cellChangeHandler(List<Integer> value) {
        // Value represents the list of selected chips or checkboxes by position.
        // Do something with value...
    }
});

Required Field

The filter form cell can be marked as a required field by passing true to the setIsRequired() method or by setting the isRequired XML attribute to true. This will add an asterisk (*) at the end of the label, to indicate that a chip must be selected.

<com.sap.cloud.mobile.fiori.formcell.FilterFormCell
    android:id="@+id/singleLineChips"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:isRequired="true"
    android:entries="@array/tabValuesArraySize8"
    app:key="Single Line Chips"/>

FilterFormCell singleLineChips = findViewById(R.id.singleLineChips);
singleLineChips.setIsRequired(true)
Last update: December 13, 2024