Resizing font in WPF list or grid to use space properly

Question

I have an application that displays league tables for sporting leagues. These tables are basically grids with different columns representing statistics for each team such as matches played, won, lost, goals scored and concieved etc. As such, a league table has one interesting property: For a given competition, we always have the same amount of rows (representing the teams). Since WPF controls are lookless, I could probably use a ListBox, a ListView, an ItemsControl directly, or even a DataGrid. Shouldn't matter all that much.

However, I want something that I haven't yet been able to achieve: Given the table size (in practice, the size of the window), ALL teams should be visible at all times (no vertical scrolling), all statistics columns (as chosen by the user) should be visible, and the font size should reflect this so that it is as large as possible without any column becoming too large for the contents to fit.

I can easily use a UniformGrid to achieve the no-vertical-scrolling part. However, adjusting the font size doesn't seem to be quite as easy.

There is of course the ViewBox, which would allow the content of each table cell to individually size itself to be as large as possible, but this would possibly lead to ugliness as you would end up with a bunch of cells with varying sizes.

I don't expect to get an easy answer to this, but if it is at all possible, I would love to hear about it. In summary:

1. Table should resize with window while always showing all data without scrollbars.

2. Font size should be set to largest possible size that allows each column of every row to display all its' contents.

3. All columns should size to smallest possible size that allows all contents to be visible, except for one column that does "*-sizing" to eat remaining space.

So.. Any clever ways to do this? :)

Answer 1

You can probably do something like this with the font size. Set the FontSize to a binding expression that binds to the TextBox itself with a custom IValueConverter ({Binding RelativeSource={x:Static RelativeSource.Self}, Converter={StaticResource FontSizeConverter}} or something like that).

Inside the converter, you now have a reference to the TextBox which you can use to get the text content, the size of the control, the size of a parent control (the grid), etc. You might be able to use this information to calculate it on the fly.

If you need the TextBoxes to make this decision based on each other, you can have a static callback at the page level that you call from within the Convert method that will make a determination if you're still in resizing mode and keep track of any other information (min or max fontsize already calculated, etc). It's a complicated process, but there should be a few ways you can go about doing this. You can even hide the text in all the boxes at first, loop through all text boxes making this kind of decision (min font size), and then set the font size programmatically and fade them into view.

Answer 2

Would it work for what you need make the child element of the window a ViewBox and put all the content within it? I'm not sure if the details of what you're doing will cause this not to work, but here's an extremely simple example of what I'm suggesting:

<Window x:Class="ZoomTest.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1">
    <Viewbox>
        <StackPanel>
            <TextBlock>2</TextBlock>
            <TextBlock>Getting longer</TextBlock>
            <TextBlock>Here is some really long text...</TextBlock>
        </StackPanel>
    </Viewbox>
</Window>

The entire content is always visible, with the maximum possible font size. All text scales uniformly.