🎉 Try the public beta of the new docs site at algolia.com/doc-beta! 🎉
UI libraries / Algolia for Flutter / Widgets

About this widget

SortBy displays a list of indices so that users can change the way hits are sorted (using replica indices) or switch between different indices to show different results.

For this to work, you must define all indices you pass to SortBy as replicas of the main index.

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
39
class SearchSortBy extends StatefulWidget {
  const SearchSortBy({
    super.key,
    required this.searcher,
    required this.sorts,
    required this.selected,
  });

  final HitsSearcher searcher; // can be lifted up (w/ callback)
  final Map<String, String> sorts;
  final String selected;

  @override
  State<SearchSortBy> createState() => _SearchSortByState();
}

class _SearchSortByState extends State<SearchSortBy> {
  late String selected = widget.selected;

  @override
  Widget build(BuildContext context) {
    return Card(
      child: DropdownButton(
        value: selected,
        items: widget.sorts.keys
            .map((sort) => DropdownMenuItem(
                  value: sort,
                  child: Text(sort),
                ))
            .toList(),
        onChanged: (value) {
          setState(() => selected = value!);
          widget.searcher.applyState(
              (state) => state.copyWith(indexName: widget.sorts[value]!));
        },
      ),
    );
  }
}
Did you find this page helpful?