Search is used to filter a list or find context-specific content.
Overview
Search is accessed by tapping on the search bar (A), which is located at the top of lists or content, immediately below the title bar.
The search bar scrolls with content.
When the page view loads, the search bar may be visible or hidden beneath the title bar depending on the app. If hidden, the search bar is accessible by scrolling up on the view.
Search can also be opened in a dedicated search view by tapping on a tab or action button.
Interaction — search filtering
The user taps the search bar to enter search mode.
The user then enters keywords to perform their search.
Matching characters are highlighted within the search results. The user taps on a result to view the item.
- A clear button (A) will show up once the user begins typing in the search field.
- Tap Cancel button (B) to exit the search mode.
The user is delivered to their desired content.
Interaction — context-specific search
The user taps the search button to enter search mode.
The user then enters keywords to perform their search.
Matching title results appear in a list and update dynamically as the user types. The user taps a title to select it.
- A clear button (A) will show up once the user begins typing in the search field.
- Tap Cancel button (B) to exit the search mode.
Content matching the selected title is displayed. At any point the user can tap the cancel button to return to the first screen.
Implementation guides
None as yet.