Scaling WPF user interface to fit screen, without distorting font aspect ratio

Question

I have a WPF application that should scale it's UI to fit the full screen - in different aspect ratios. I'm using grids for some of it, but that doesn't scale the font, and a ViewBox to scale a TabControl, but that distorts the text by changing it's aspect ratio.

Does anybody have an alternative that scales the geometry of controls, and the font size of the text, but keeps the same aspect ratio for the font?

I've been searching for a while but nobody seems to have answered this exact issue.

This issue seems to suggest I could write something myself from scratch, but I don't see any implication I can do get control of the font scaling: Making a Viewbox scale vertically but stretch horizontally

Answer 1

My own solution is primitive but does work to some extent.

To define control geometry, use grids with fractional width/heights, and other controls sizing to fit their content.

Calculate font scaling from the window's actual height divided by it's design height.

Set font size at the window level to designed size * scaling.

Problems:

• have to hard code the original design height as there doesn't seem to be any way to get this from the XAML
• have to hard code the original designed font size, ditto.
• doesn't scale padding or margins, so proportions still tend to get a bit wonky.
• if you want different font sizes, have to write code for all of the different controls.

WPF really makes this difficult IMO: it has scalable, resolution independent elements, but not much to actually help you build scalable user interfaces.

Answer 2

WPF does indeed have that control... it's called a Grid. Most WPF developers design applications where controls will automatically grow to fill the size of the Window while maintaining the same font size and aspect ratio. If you want a particular part of it to enlarge itself as the Window enlarges, then use a ViewBox for that part... not the whole Window.