Add UI Scaling Ability

[andrewdavidmackenzie]

Discussed in #746

^{Originally posted by jrodden1 December 17, 2024}

Description

Often times, Pi's are running on tiny little 7" touchscreens at 800x600 or 1024x600. Since I was unable to find a UI scale option (and Ctrl + - and Ctrl + + had no effect), it is rather cumbersome to navigate. It looks super nice but would be wonderful to be able to scale it down so that it'll all fit on a 800x600 screen. I have attached a screenshot of what it looks like currently on the little 7" touchscreen running 800x600 to illustrate the issue.

Desired Results

• Have the ability to set various UI scaling levels
• And/or have an option for 'Small Screens' that is designed for smaller resolution screens.
• And/or have the ability to cherry pick which pins I see and monitor so that it fits on the tiny screen.

Current Results

• Unable to change the UI scaling
• Having to use Alt + Click and Drag to navigate around the window to resize it and having to deal with scroll bars and big UI elements that don't scale.
  

Comments

This app looks to be SUPER helpful, by the way. I just figured it would be helpful to have a scaled version that fits on tiny screens too. :) Thanks for your work @andrewdavidmackenzie!

[andrewdavidmackenzie]

Look at adding UI scaling

• check things scale "linearly" and fonts match graphics, waveforms etc.
• interactively with SUPER-+ or SUPER--
• consider some UI element or slider in info row at the bottom, or in a menu in the info row.

Investigate also

• Implementing a different "compact" layout, with different dimensions for everything.
• Detecting screen size, and depending on some range of sizes, automatically switch to the compact layout
• Adding compact layout as an option to the layout menu
• Adding a custom layout option (a variant of the logical pin layout, which is vertical column of pins) where pins can be hidden or viewed, to reduce the height needed, and reduce clutter of pins not being used. Will need a way to recover pins that are hidden, either one by one or a "reset" option for the layout.

[andrewdavidmackenzie]

FYI @jrodden1

[andrewdavidmackenzie]

hi @jrodden1 now that I got 0.6.0 release out, with all the work it needed, I'm back looking at this.

Here is a first screenshot that shows it working, but one of the first problems I'll need to overcome:

The scaling has clipped the waveforms at the bottom, and some of the verticals are removed (scaled to less than a pixel I assume), so I'll have to look at that.

I was wondering, how would you prefer it to work?

Here are some options I've thought of

• Command line option to set the initial scale factor?
• Detect the screen size (if I can, seems harder than you would expect) and set the scaling factor so the window fits in the screen (plus some margin)
• A slider in a menu or similar to scale it after starting?

Any other ideas?

I'll copy that to the issue