Display size sliders (UI scale, card size, spacing): feedback on design before PR

[JustinZeus]

What I'm proposing

A new "Display size" page under Settings exposing three global sliders. I based the design of this page on the current home settings one, with a similar preview pane. The sliders I'm proposing are the following:

• UI scale (50–150%): overrides LocalDensity.density at the MainContent root, so everything that derives from density scales uniformly. fontScale left untouched so the user's Android accessibility setting still applies on top.
• Card size (50–150%): scales card heights across browse surfaces.
• Spacing (25–175%): scales inter-card spacing across browse surfaces.

Per-row controls aren't gone, they multiply

Existing per-row Card size / Spacing controls return as percent multipliers (default 100) on HomeRowViewOptions. They compound with the global, so a row at 110% with global at 125% renders at ~138% effective. Same idea for Spacing.

Design choices (looking for input)

These touch features that have been added recently or conflict with the suggested design. These are open to change and I welcome discussion.

1. Per-library Spacing slider from Add list view for libraries #1428 (removed).

   • Reasoning: with a global Spacing slider, the per-library one felt redundant; two adjacent Spacing controls in the View Options dialog seem illogical
   • ViewOptions.spacing stays as a type-driven base (16 poster / 24 wide / 16 square) set by the type setter, multiplied by the global Spacing percent at each consumer.
   • Alternative I've considered: keep the per-library slider, restate it as a percent multiplier compounding with the global. Same idea as the per-row multipliers.

2. resizeCards() Increase/Decrease per-row buttons in HomeSettings (removed).

   • Reasoning: the per-row Card size multiplier slider (new) does the same job more directly.

3. Preset-set rows now scale with the global slider.

   • Reasoning: if presets were insulated, the global slider would feel inconsistent; it would scale most rows but skip the specific ones the user explicitly picked. Now: preset is the anchor base, both multipliers apply on top.

4. New preview page

   • Honestly, it felt more intrusive to rework the current Home page settings view. I do however see an opportunity to consolidate it with my new one, as it's nearly identical in layout and the features are somewhat adjacent.

Migration

• AppPreferencesSerializer seeds the new percent fields on first run.
• AppUpgradeHandler resets them on upgrade from a configurable cutoff (currently 0.6.4-31-g0).
• Existing stored HomeRowViewOptions JSON with heightDp: 172 or heightDp: 128 deserializes transparently and resolves against the global sliders.
• A decode-time helper translates any lingering legacy spacing field on stored rows into the new spacingMultiplier.

Status

I have an active branch close to PR readiness: JustinZeus:fea/display-size. All builds are green, unit tests cover the resolver math + density invariants. I'd love to open the PR, but feel like it makes sense to talk through the contentious choices above and potentially gather some more input on other areas as well. If any of them are non-starters (maybe even the entire idea..), I'd rather adjust before opening than after.

Screenshots:

Pre-existing context

• UI Layout Scaling and Navigation Rail Clipping #1345: original "UI Layout Scaling and Navigation Rail Clipping" issue. I commented there a while back that I was working on this.
• [FEA] - Ability to change size of posters on homepage #891: change poster size on homepage (closed without resolution).
• [FEA] - Tune font size of titles #643: tune font size of titles.
• [FEA] - Customize movie/series title font size on library #919: customize movie/series title font size on library.

[tommyvandamme-sketch]

I currently set text scaling on my Shield at 85% because I think it makes Wholphin look even better and mainly because it can display more description text on the home screen (currently it's really short) See also #1006. If I understand things correctly this would essentially allow for Wholphin's UI to be scaled separate from the rest of the device. So I'm all for this.

[damontecres]

This is an interesting idea. I don't know that I'm 100% on board with it yet, I think I need to try out your branch first. I am very curious what others think because I know some common feedback is that the UI elements can be too large (my eyesight is terrible 😅).

I guess sort of related, I was exploring customizing font sizes in a similar-ish way. Right now Wholphin doesn't override anything in the Typography, so adding a scale factor there could be an interesting idea too.

Also, let me tag @Pentaphon & @YogiBear12 since they always have good UI feedback.

[YogiBear12]

I think I'm in agreeance with what everyone else has said already - scaling elements rather than the overall UI.
For me personally, I already have the card sizes changed on the homepage and libraries using the available settings, so the only additional thing I would scale down for my usage is the size of row headers. But even that's not a big deal 🤷‍♂️

[Pentaphon]

My first impression is that I don't really think the UI scale setting is necessary at all because the current overall UI size doesn't seem like something that most users want tweaked and that the card size and spacing is something users do seek to tweak and is already partially taken care of by @damontecres and will eventually be fully taken care of in a future update. Card/poster spacing is the only element that hasn't really been addressed yet and even that doesn't need much of a slider since you can only make cards/posters spacing so big or so small before it starts to look silly.

I personally think our dev has this handled with the current UI settings and he just needs to add (a very slight) spacing slider to the current UI settings and then make them work for the entire app. Or he could just incorporate all of this in a future update if he doesn't agree with my assessment at all.

[JustinZeus]

Thanks for the replies and discussion.

@damontecres trying the branch first makes sense, I'd rather you do that than take my word for it. JustinZeus:fea/display-size is current, and I can drop an APK somewhere if that makes it easier to test on a real device. Try it whenever and tell me if something feels off. I'd rather adjust before a potential PR than after.

Bit of context: I've only been using the app for a little over a week and am just getting my feet wet contributing, so I'm not trying to plant a flag on scope. I built this because my experience is close to tommy's. I'm the kind of person who'll adb over wifi into my 'locked' Philips TV just to bring the OS scale down, so there is definitely some intrinsic motivation involved. For an app this polished I'd half expected a setting like this somewhere in a menu already. What I like about this approach, is it lets people tailor their setup without getting in the way of anyone who doesn't care, since it defaults to 100% and sits on its own page.

On typography: I did consider fonts before I started, but most of the issues and discussions I came across while looking around seemed to be about more than just text size, so I went with density instead. I'm still new to Kotlin and have since come across something that made me consider how every surface the root density override touches (dialogs, overlays, the player) might be affected. So that's testing/adjustments I'd want to do anyways before the code is ready for open review.

@Pentaphon since damontecres tagged you I read through a few of your issues, and you clearly pay close attention to sizing (the people circle / metadata fonts thing for example). I'd genuinely value your take here: if you were trying to make people like tommy and me happy, which route would you go?

[Pentaphon]

I'd genuinely value your take here: if you were trying to make people like tommy and me happy, which route would you go?

I'd focus more on card size and spacing than UI scaling since I don't see any demand for UI scaling, but if people DO want UI scaling, I'm not opposed to it. I think there's definitely more demand for text scaling so I'd drop UI scaling for that.

[JustinZeus]

Thanks for the input @damontecres and @Pentaphon. Had some time to think about it and I think the feedback really helped push me in the right direction. I rewrote a fair amount of the branch The current one is JustinZeus:fea/display-size-v2 (fea/display-size is stale now).

One thing you were both pointing at makes a lot of sense to me, doing text scaling over trying to make this an entire UI thing. The core changes: no more LocalDensity override at MainContent, UI scale is gone entirely. Text now scales through enumerated MaterialTheme Typography roles.

The sliders were also not really sitting right with me, so instead opted for staged controls with predetermined values. I think this helps with the UX part of the feature and it definitely improves QA, there's a lot less that can go wrong unnoticed this way.

At Default the app renders the exact same pixels as upstream as far as I can tell, so installing this and not touching the page shouldn't affect any current user's experience.

A few frames from the 1080p AVD. Default first, so the same-pixels idea is the easy one to check:

The settings page:

All three at Extra small:

All three at Extra large:

Going to pull this onto my actual TV tonight and live with it for a bit. Feels good to me, but I'd genuinely value your read once you've had a chance to try it.

[tommyvandamme-sketch]

That extra small setting is exactly what I'm looking for.

[JustinZeus]

Would you like me drop an .apk somewhere so you could test in on your tv?

[tommyvandamme-sketch]

Thank you for offering but that's fine. No need. I'll let you guys work out all the details. You've all got things well in hand. I'll keep an eye how things proceed from here and stick to the main release versions ☺️

[Bellygin]

Hi all - I figured I would drop in my .02 on the UI scaling and text/description sizing. This is something I've been interested in for a while now hoping to see changes, or learn to try on my own.

I've been hoping for more condensed UI elements to help the "show" the content: backgrounds, posters, descriptions all stand out a bit more. I spend a bit of time gathering unique posters/images, and I also try to write a little in my descriptions for additional details for my users. To me the content feels a bit cramped or pushed some due to the larger elements on television - particularly when the nav bar expands with text.

Below is the original image from the Additional Screenshots section on git. Below that is a photoshop mockup - I scaled down just the UI Elements (nav bar, play row, cast) to 75%. I left all the text at the regular size. I tried my best to match the font and kept the description elements at the same size (100%) but added additional text lines for the description.

Original Scale

75% UI elements