feat(card-browser): Redesign using Material 3 SearchView [Dev only] by david-allison · Pull Request #20454 · ankidroid/Anki-Android

david-allison · 2026-03-13T15:35:58Z

Purpose / Description

The overall aim of this change is to move the Card Browser to a Material 3 SearchView.

When tapped, a new interface for search selection is shown.

Due to this interface, we can remove the following options menu items:

My Searches & Add Search
- Now managed inside the SearchView
Change Display Order
- Moved to a small chip
Filter suspended; Filter by tag; Filter by flag
- Moved to chips
Filter marked
- Removed - see commit for justification

Filters/chips

A single-line chip bar, horizontally scrollable, is placed below the SearchView. This is visible when the SearchView is expanded and collapsed. Tapping on a chip either opens our existing dialog (decks; tags), or opens a bottom sheet, where one or more items may be selected. When an item is selected, the search is instantly re-applied, and the chip changes to a 'selected' state.

The label is updated to reflect the selection. Flags changes to Flag/No Flag if the red flag is selected or Flag +1 if an additional flag is selected. In the latter case, Red would be the flag which the user selected first. In the case of Flags and State, the icon is updated to match the icon of the first selected flag/state

Multiple selections with the same filter act as a logical OR (for example: a red OR an orange flag). Different filters act as an AND (Default deck AND (a red flag OR an orange flag))

An additional 'sort order' chip is displayed when the SearchView is collapsed. The icon is reversed if the direction of sort is reversed

Fixes Card Browser: Convert Display Order to Chip for sorting #17732

`StandardSearchFragment`

The initial fragment when a SearchView is opened. This displays the search history to the user, chips, and the user's saved searches.

Search history

Each SearchHistory item renders the SearchRequest: the query is shown in a dark color, and the filter selections are shown in a lighter color, so a user can differentiate where their textual input ends.

Search History entries are persisted using IDs, not names, so (for example) a search history entry is still valid if the deck is renamed.

Any search history item can be marked as a saved search

⚠️ Updates occur too often when a user is updating filters and the SearchView is closed
⚠️ TODO: What happens if a deck is deleted?
⚠️ 'See More' is not yet implemented

Saved Searches

A concept in Anki Desktop. We implement:

Save Current Search ✅
Delete ✅
Rename ❗️
Search ✅

Fixes Case insensitive search for Cyrillic text #14464

Saved searches are sorted in the backend, so we cannot easily control the order

A user can tap a saved search to immediately search, or tap the 'insert' to replace the text in the search bar with the value of the search

We reuse our existing Saved Searches dialog for management of the searches:

SearchView Functionality

A CardBrowserSearchViewModel is introduced, now responsible for both the filters and the search query. This ViewModel supports submitting the completed query to the CardBrowserViewModel. This is introduced to reduce the complexity of the

This ViewModel is also responsible for the saved search and history logic exposed by the StandardSearchFragment, as well as an existing AdvancedSearchFragment

See feat(card-browser): Advanced Search [Dev only] #20071

⚠️ Lots of pending dialog boxes
⚠️ No ability to toggle back to the Standard Search, only submitting the search.

Scrolling

The SearchView is hidden on scroll

⚠️ This is not triggered by the scroll bar, only by the scroll gesture
⚠️ A couple of bugs remain where the scroll bar size does not match with the new height of the RecyclerView

Fixes

The skeleton for Card Browser: Migrate to Material 3 SearchView #18709
Fixes Add card browser chip filtering for flags #17355

How Has This Been Tested?

Unit tested, dev-only functionality, so low-risk. Also tested on my Pixel 9 Pro (Android 16)

git rebase -x "./gradlew jacocoUnitTestReport --daemon" $(git merge-base HEAD main)

Checklist

You have a descriptive commit message with a short title (first line, max 50 chars).
You have commented your code, particularly in hard-to-understand areas
You have performed a self-review of your own code
UI changes: include screenshots of all affected screens (in particular showing any new or changed strings)
[⚠️] UI Changes: You have tested your change using the Google Accessibility Scanner

github-actions · 2026-03-13T15:36:10Z

Important

Maintainers: This PR contains Strings changes

Sync Translations before merging this PR and wait for the action to complete
Review and merge the auto-generated PR in order to sync all user-submitted translations
Sync Translations again and merge the PR so the huge automated string changes caused by merging this PR are by themselves and easy to review

BrayanDSO

I haven't seen the code yet

Status bar should be transparent

Should the Add button be a primary option in the search view? Other options are 1. putting it on the menu 2. replacing it with Preview

The menu entries (or some of them) could have icons

Sorting can be better, but handled in #20240

david-allison · 2026-03-14T12:49:56Z

Status bar should be transparent

Agreed, but I wanted to save it for the research study

Forward-port UI to new edge-to-edge for API35 #17334

Should the Add button be a primary option in the search view?

How would you feel about:

Add is primary if there are no results, Preview is primary otherwise

EDIT: I tried, I moved 'preview' to 'always' and add is 'ifRoom', Android wants 2 icons.

We may be able to do better when we remove the legacy menu

The menu entries (or some of them) could have icons

💜 GREAT idea, thank you!

Sorting can be better, but handled in #20240

I did have sorting in this PR, but I extracted it to the below (blocked currently). These also affect sorting on the 'non-dev' app

This is a new Material 3 based SearchView Supports: * Chips (filters: decks; tags etc...) * Saved Searches * History & saving searches from history * Toggle to an 'Advanced Search' This PR is just an initial design and a sample test, no functionality Issue 18709

Starts off the implementation of the Material 3 SearchView by allowing a user to press 'search/enter' to submit a search to the card browser Part of 18709

A history entry can be saved, or tapped to search for it History is limited on the root fragment to 5 entries 'See more' will be implemented at a later date For issue 18709

Many users do not know about saved searches, and this makes them more prominent. Saved Searches are persisted in the collection, currently unordered AnkiDroid now has an easy mechanism to save any search in the history Searches have a basic 'manage' panel, only available if searches exist, allowing a user to see, select and remove their searches, this uses the previous screen A search may be tapped to search, or like Google Chrome, an 'insert' button may be used to replace the current input of the search bar with the search, without submitting it. Part of 18709: Material 3 SearchView

Updates SearchResult with `toUserSpannable`: producing a user-facing string, where the filter selections are dimmed, and the search text is prominent. This makes it obvious why the filters are removed from the EditText when a user taps into it This updates the empty search from '' to 'deck:*', which matches Anki Desktop. Part of 18709

Part of 18709

If someone backs out of the search fragment, the changes should be discarded Part of 18709

Part of 18709

Example: query = 'foo' deck = Default Would produce 'foo deck:Default', where 'deck:Default' is faded, as it came from a chip Coloring requires the database (buildSearchString), so we want to offload this for later to reduce latency So we now have a 'Loading' and 'Loaded' state for when the history changes Part of 18709

hide 'action_list_my_searches' & 'action_save_search' - in SearchView hide 'action_search_by_tag' - in a chip Part of 18709

* Anki Desktop no longer shows this prominently * A poll of Discord shows people no longer use it * Technically a tag Part of 18709

and sync Filter state to StandardSearchFragment.kt Part of 18709

This fixes resetting state on back, and submission Part of 18709

Part of 18709

Define a color which is better than the standard purple Calculation: colorSurfaceContainerHigh (HCT model) * +15 Chroma (light) * +10 Chroma (dark) * Choose a darker gray (plain) * Eyeball a light black (black) and set colorSurfaceContainerHigh Issue 18709

'add' only appears if there are 0 cards selected so preview is hidden From a review comment on 20454

github-actions bot added the Needs Review label Mar 13, 2026

github-actions bot added the Strings label Mar 13, 2026

david-allison commented Mar 13, 2026

View reviewed changes

david-allison force-pushed the browser-advanced-more branch 2 times, most recently from 1184ec6 to a547847 Compare March 13, 2026 16:39

BrayanDSO reviewed Mar 14, 2026

View reviewed changes

david-allison added Needs Author Reply Waiting for a reply from the original author and removed Needs Author Reply Waiting for a reply from the original author labels Mar 14, 2026

david-allison force-pushed the browser-advanced-more branch from 21a4334 to 287cef9 Compare March 14, 2026 23:02

github-actions bot added the Has Conflicts label Mar 15, 2026

david-allison force-pushed the browser-advanced-more branch from 287cef9 to f966011 Compare March 15, 2026 15:56

david-allison removed the Has Conflicts label Mar 15, 2026

david-allison force-pushed the browser-advanced-more branch 2 times, most recently from 1b96af3 to 266914c Compare March 15, 2026 16:08

github-actions bot added the Has Conflicts label Mar 20, 2026

david-allison removed the Has Conflicts label Mar 20, 2026

david-allison force-pushed the browser-advanced-more branch 2 times, most recently from b202025 to c9d9bf8 Compare March 20, 2026 18:20

This was referenced Mar 20, 2026

Show answer warning #20531

Closed

Case insensitive search for Cyrillic text #14464

Open

github-actions bot added the Has Conflicts label Mar 28, 2026

david-allison mentioned this pull request Apr 5, 2026

Browser search deals badly with new line #20657

Open

david-allison force-pushed the browser-advanced-more branch from c9d9bf8 to cf7267d Compare April 6, 2026 10:20

david-allison removed the Has Conflicts label Apr 6, 2026

github-actions bot added the Has Conflicts label Apr 7, 2026

david-allison added 3 commits April 15, 2026 13:08

feat(card-browser): perform search from new SearchView

97490bf

Starts off the implementation of the Material 3 SearchView by allowing a user to press 'search/enter' to submit a search to the card browser Part of 18709

feat(card-browser): handle search history in new SearchView

eaba008

A history entry can be saved, or tapped to search for it History is limited on the root fragment to 5 entries 'See more' will be implemented at a later date For issue 18709

david-allison added 15 commits April 15, 2026 13:09

feat(card-browser): select deck with a chip

c7493ee

Part of 18709

feat(card-browser): sync search fragment and main fragment filters

42351e3

If someone backs out of the search fragment, the changes should be discarded Part of 18709

feat(card-browser): select tags with a chip

fb49943

Part of 18709

feat(card-browser): delegate menu to SearchBar

c813788

hide 'action_list_my_searches' & 'action_save_search' - in SearchView hide 'action_search_by_tag' - in a chip Part of 18709

feat(card-browser): hide 'show marked'

73bbb6d

* Anki Desktop no longer shows this prominently * A poll of Discord shows people no longer use it * Technically a tag Part of 18709

feat(card-browser): 'Card state' filter chip

6df9ece

and sync Filter state to StandardSearchFragment.kt Part of 18709

feat(card-browser): move filters to SearchViewModel

b9f3b72

This fixes resetting state on back, and submission Part of 18709

feat(card-browser): select flags with a chip

430c0ac

Part of 18709

feat(card-browser): add a chip to select sort order

8acd3d4

Part of 18709

feat(card-browser): show 'preview' before 'add' in new UI

23e5565

'add' only appears if there are 0 cards selected so preview is hidden From a review comment on 20454

feat(card-browser): add icons for non-multiselect options

bf2e931

david-allison removed the Has Conflicts label Apr 15, 2026

david-allison force-pushed the browser-advanced-more branch from cf7267d to bf2e931 Compare April 15, 2026 12:09

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat(card-browser): Redesign using Material 3 SearchView [Dev only]#20454

feat(card-browser): Redesign using Material 3 SearchView [Dev only]#20454
david-allison wants to merge 18 commits intoankidroid:mainfrom
david-allison:browser-advanced-more

david-allison commented Mar 13, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Mar 13, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

BrayanDSO left a comment •

edited

Loading

Uh oh!

david-allison commented Mar 14, 2026 •

edited

Loading

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

david-allison commented Mar 13, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Purpose / Description

Filters/chips

StandardSearchFragment

Search history

Saved Searches

SearchView Functionality

Scrolling

Fixes

How Has This Been Tested?

Checklist

Uh oh!

github-actions bot commented Mar 13, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

BrayanDSO left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

david-allison commented Mar 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

david-allison commented Mar 13, 2026 •

edited

Loading

`StandardSearchFragment`

BrayanDSO left a comment •

edited

Loading

david-allison commented Mar 14, 2026 •

edited

Loading