Components
On this page
The Flutter Helpers are available as alpha software. They depend on the Algolia Dart API client, which is developed by the community. Note that the Algolia SLA don’t apply to community projects. To share feedback or report a bug, open an issue.
Each UI template comes with a set of functional blocks (“components”) and a demo site consisting of pages created with those components. For example, the Ecommerce UI template’s demo site has:
- A home page
- Product listing pages
- Product detail pages.
These pre-packaged components are designed to be as independent as possible, so you can choose the ones you’re interested in. They’re typically composed of InstantSearch widgets, Autocomplete plugins, and non-Algolia components.
The Ecommerce UI template components are cross-platform, all components are optimized to render well on both iOS and Android.
Data sources
The ecommerce experience requires a sources of entity objects. In this example, there are three entity objects: products, query suggestions and search.
| Component | Description |
|---|---|
| Product repository | Repository providing access to products information. |
| Suggestion repository | Repository providing access to query suggestions and queries history.. |
| Search repository | Repository providing access to products indices. |
Home page
| Component | Description |
|---|---|
| Showcase | Organizes media-rich records into easily scannable rows |
Product listing page
Display
| Component | Description |
|---|---|
| Display products | Display multiple products using different layouts (as a grid or list) with infinite scrolling |
| Product card | Map your record structure so that you can display a product card |
| No results | Display different options to users when there are no results for a specific search |
Search
| Component | Description |
|---|---|
| Autocomplete | Display search autocomplete view with search history and query suggestions |
Filtering
| Component | Description |
|---|---|
| Filters | Filter results from a sidebar drawer |
| Facets | Filter product results with facets |
| Sort | Sort products according to different criteria |
