API Reference / Android Widgets / Filter List

Filter List

Widget signature
FilterListConnector.All(
    filters: List<Filter>,
    filterState: FilterState,
    selectionMode: SelectionMode,
    groupID: FilterGroupID
)

About this widget

FilterList is a filtering view that displays any kind of filters, and lets the user refine the search results by selecting them.

Compared to the RefinementList, which takes its values from the search response facets, this widget displays filters that you add yourself.

Examples

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
class MyActivity: AppCompatActivity() {
    val client = ClientSearch(
        ApplicationID("YourApplicationID"),
        APIKey("YourAPIKey")
    )
    val index = client.initIndex(IndexName("YourIndexName"))
    val searcher = SearcherSingleIndex(index)
    val filterState = FilterState()
    val color = Attribute("color")
    val price = Attribute("price")
    val filters = listOf(
        Filter.Numeric(price, 5..10),
        Filter.Tag("coupon"),
        Filter.Facet(color, "red"),
        Filter.Facet(color, "black"),
        Filter.Numeric(price, NumericOperator.Greater, 100)
    )
    val groupAll = groupAnd(all)
    val filterListConnector = FilterListConnector.All(
        filters = filters, 
        filterState = filterState, 
        groupID = groupAll
    )
    val connection = ConnectionHandler(filterListConnector, searcher.connectFilterState(filterState))

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val filterListView: FilterListView.All = MyFilterListAdapter() // your `FilterListView.All` implementation
        connection += filterListConnector.connectView(filterListView)
        searcher.searchAsync()
    }

    override fun onDestroy() {
        super.onDestroy()
        connection.disconnect()
        searcher.cancel()
    }
}

Low-level API

If you want to fully control the FilterList components and connect them manually, use the following components:

  • Searcher: The Searcher that handles your searches.
  • FilterState: The current state of the filters.
  • FilterListViewModel.All: The logic applied to the filters.
  • FilterListView.All: The view that renders the filters.
  • FilterPresenter: Optional. The presenter to customize the display of the filters.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
class MyActivity : AppCompatActivity() {
    val client = ClientSearch(
        ApplicationID("YourApplicationID"),
        APIKey("YourAPIKey")
    )
    val index = client.initIndex(IndexName("YourIndexName"))
    val searcher = SearcherSingleIndex(index)
    val filterState = FilterState()
    val color = Attribute("color")
    val price = Attribute("price")
    val filters = listOf(
        Filter.Numeric(price, 5..10),
        Filter.Tag("coupon"),
        Filter.Facet(color, "red"),
        Filter.Facet(color, "black"),
        Filter.Numeric(price, NumericOperator.Greater, 100)
    )
    val viewModel = FilterListViewModel.All(filters)
    val connection = ConnectionHandler()

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val view: FilterListView.All =  MyFilterListAdapter() // your `FilterListView.All` implementation
        connection += searcher.connectFilterState(filterState)
        connection += viewModel.connectFilterState(filterState)
        connection += viewModel.connectView(view)

        searcher.searchAsync()
    }

    override fun onDestroy() {
        super.onDestroy()
        connection.disconnect()
        searcher.cancel()
    }
}

Parameters

filters
type: List<Filter>
Required

The filters to display.

filterState
type: FilterState
Required

The FilterState that will hold your filters.

selectionMode
type: SelectionMode
default: Multiple
Optional

Whether the list can have Single or Multiple selections.

groupID
type: FilterGroupID
default: FilterGroupID(FilterOperator.And)
Optional

The identifier for the group of filters.

View

view
type: FilterListView.All
Optional

The view that renders the filters.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
val view: FilterListView.All = MyFilterListAdapter()
filterListConnector.connectView(view)

// Example of FilterListView.All implementation
class MyFilterListAdapter : FilterListView.All,
    ListAdapter<SelectableItem<Filter>, FilterListViewHolder>(DiffUtilItem()) {

    override var onSelection: Callback<Filter>? = null

    override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): FilterListViewHolder {
        return FilterListViewHolder(parent.inflate(R.layout.list_item_selectable))
    }

    override fun onBindViewHolder(holder: FilterListViewHolder, position: Int) {
        val (filter, selected) = getItem(position)
        holder.bind(FilterPresenterImpl()(filter), selected) { onSelection?.invoke(filter) }
    }

    override fun setItems(items: List<SelectableItem<Filter>>) {
        submitList(items)
    }
}

class DiffUtilItem<T : Filter> : DiffUtil.ItemCallback<SelectableItem<T>>() {
    override fun areItemsTheSame(oldItem: SelectableItem<T>, newItem: SelectableItem<T>): Boolean {
        return oldItem.first == newItem.first
    }

    override fun areContentsTheSame(oldItem: SelectableItem<T>, newItem: SelectableItem<T>): Boolean {
        return oldItem == newItem
    }
}

Did you find this page helpful?

InstantSearch Android v2