Skip to content

New UI for main screens

This is the bulk of the UI designs outlined in #709 (closed). It is missing some key parts which I'll document below, but here is the things it does support:

  • Five tabs on the main screen with bottom navigation
    • Overview, aka "What's New?"
    • Categories
    • Swap (just an entry point to the existing swap activity)
    • My Apps (Updateable and Installed - have another branch with just "Updateable" as per the newer mockups)
    • Settings
  • Integrated with the new App Details screen recently merged into master
  • Searchable list of apps (viewable by either going to a category or via the main search button)

Each of these has screenshots below.

Code

The diff is huge, but I've rebased it so that if you review the first X commits then we can create a MR with those and it should build and work. I didn't think it was neccesary to send through 10 MRs for this though, so feel free to review as a whole, or review individual commits and request we merge bit by bit.

Missing features (in future MRs)

General UI stuff

  • Ensure accessible everywhere. I've gone through and made most places accessible. The only outsanding issues are now:
    • BottomNavigationView doesn't read out the title of items when selected. I created this issue in AOSP to address it. If that doesn't get addressed, then this repo contains the code in a way that would likely be easier to fork and patch.
    • TTS reader combines the app name and summary when reading app lists. It should pause inbetween reading both as if it is a different sentence.
    • Touching the background of the recycler view in the categories screen reads out all category names. Not sure if that is a good or bad thing.
    • Likely other problems too. It would be ideal to get some feedback from visually impaired users to find out whether we've done an alright job or not.
  • Ensure API 10 supported
    • Ensured no crashes due to API incompatibility.
    • There are some minor layout quirks, mainly around the absence of padding where there should be padding, and other minor things like that. This should all be resolved only once we have decided that the UI is final, because it requires copy-pasta-ing code from one layout to another.
  • Paddings/font-sizes/etc should be measured out more accurately as per the mockups in #709 (closed).
  • All inline styles should be moved to theme, so that people can contribute new themes relatively easily.
  • Drop shadow on the inline download buttons (on My Apps or the other app list screens)
    • Done in pserwylo/new-ui--inline-download-improvements branch.
  • Download button should probably be filled with white, because the other buttons with blue borders are.
    • Done in pserwylo/new-ui--inline-download-improvements branch.
  • Text under app in overview screen should be "Just added" not "Recently updated"
  • "Recently Updated" and "Just added" on overview tab should be grey not black.

General UI stuff (pending further design discussions)

Requires feedback from @crwinfrey and other interested parties before deciding what to do:

  • When there are no apps to update, My Apps could look nicer.
  • The "Installed" section should not just be empty if the repo hasn't been updated. The user will indeed have installed apps on their phone, just not any provided by a current repository in their F-Droid client)
  • When there are no apps to show in the overview, should show some sort of feedback.

The following are subject to feedback (of one form or another) from the latest round of user testing by @crwinfrey. They probably need to be revised/reconfirmed before implementing:

  • Overview page hasn't implemented the "Show four different apps in the prime position and let the user choose a different one via the dots under the app description" part of the UI.
  • Category icon should change to that proposed by Carrie (the happy/sad masks)
  • Number of updateable apps shown on the bottom navigation bar (in a red circle to the top right of the "My Apps" icon)

Categories screen

Shouldn't just choose the first X apps in alphabetical order each time.

  • Maybe the most recent or something?
  • We discussed maybe rating based on the quality of the metadata, to encourage people to get their metadata up to scratch, and to showcase apps which make the client look feature rich.
  • Otherwise a random selection would be fine, where the random selection could be seeded based on, e.g. the current day, or it could pick new apps each time the user navigates to that screen.

Misc

The following things are no longer accessible due to the loss of the menu in the main screen:

  • About dialog
    • Should this go in the settings screen now?
  • Update repos
    • In the mean time, I've added a functional pull-to-refresh which we can decide whether to keep or not later.
  • Bluetooth F-Droid to another phone

When no apps are available, show something on the main page.

Known bugs

Feature Image artwork sometimes renders blank after returning from elsewhere

Screenshots

Five tabs on the main screen with bottom navigation

main.whats-new main.categories.v2 main.swap main.my-apps.01 main.my-apps.02 main.settings

Integrated with the new App Details screen recently merged into master

app-details

Searchable list of apps (viewable by going to a category right now, but in the future also via the main search button)

app-list.category app-list.category.search app-list.search

Merge request reports