How to resize C# WPF Program to fit any screen resolution

Question

I am trying to figure out how to resize my C# WPF Program to essentially fit any screen resolution. I am trying to fit my program to a computer with a screen resolution of 1280 x 1024. I can't find any information on how to do this exactly, of course I could rig the dimensions of the program to fit the specific screen but every computers screen resolution could be potentially different right? I tried using the obvious solution that was provided here: Resize WPF Window and contents depening on screen resolution but it did not help at all.

i.e. I used: (Also, I wasn't sure if I needed to set the HorizontalAlignment & VerticalAlignment to "stretch" as well, but I did anyway.)

Title="my screen" Height="{Binding SystemParameters.PrimaryScreenHeight}" Width="{Binding SystemParameters.PrimaryScreenWidth}" WindowStartupLocation="CenterScreen" WindowState="Maximized">
    <Grid Name="myGrid" Background="LightGray" Margin="0,0,2,-30" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
        <TextBox Name="stuffTB" HorizontalAlignment="Left" Height="28" Margin="751,252,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="186" />

...

Whenever I run my exe on the computer with the dimensions of 1280 x 1024 it cuts off contents that are in my grid. Any advice or help would be great, even links to examples would be awesome. Thanks in advance.

Trammell

Why not just make it maximised? – Bernini

You mean WindowState = "Maximized" ? If that is what you are referring to, check the code in the OP I provided. – Trammell

You need to be more specific on what you mean by 'resize' and also perhaps 'resolution'. Strictly speaking 1280 x 1024 is size in pixels, not resolution. Likely what you want to happen is different for a data-entry window as opposed to a photo editing app, for example. Perhaps you need to read up on device-independent units in WPF too. – Howl

Screen resolution refers to dimensions on your computer desktop. When you right click >> personalize >> screen resolution, something x something, that is the dimensions I am referring to. Again, I'll restate the problem I am having, whenever I run my program's executable on computers with Screen Resolution dimensions of 1280 x 1024, the buttons are cut off because the grid content is not moving itself inside the window, i.e. resizing itself i guess? It works fine on other computers with higher dimensions though. – Trammell

Furthermore, there are buttons that the user can not click because they are off of the window in the bottom right because the window itself fits the screen but the content inside of the grid is running off of the window. – Trammell

If the grid is bigger than the window then you need to change the size of the grid from an absolute size to one related to the size of the window. – Howl

What would you suggest is a good size for the Grid being that the window is resolution 1280 x 1024? – Trammell

For the Grid @Howl should I just do binding.primaryheight for the hight and the width binding for the width? – Trammell

Can I suggest you just open a test project and experiment with the grid and window properties? This isn't a trivial subject and it's not the same as Winforms - in fact if you are used to Winforms you will have to unlearn that first. Also have a look at [this tutorial]( blogs.msdn.com/b/wpfsldesigner/archive/2010/06/03/…) – Howl

You are correct, it isn't trivial at all. I guess I'm going to have to just figure out how to use StackPanels? This other guy posted a solution with a ViewBox, but I don't understand how that is supposed to help me. – Trammell

As a start, just open a new WPF project. Don't change anything except the grid background colour. Run it, resize the window, see what happens. Now change stuff and see what happens. Also see the link I posted. Also I recommend MacDonalds book Pro WPF in C# 2010 (or similar) – Howl

Answer 1

If you really want to force resize all the controls in the windows you can use ViewBox https://learn.microsoft.com/en-us/dotnet/api/system.windows.controls.viewbox

But IMO you're doing it wrong. The basics of designing good WPF UI would be:

1. Use grid columns and rows if you want something to hold some part/percentage of the window despite the content
2. Use DockPanels, StackPanels, WrapPanels etc. eto arrange the UI
3. Use ScrollViewer to be able to see the controls if they have some minimal dimensions set and on the specific resolution they would get cut off

Look at this sample I've created for you

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="2*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="100" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <StackPanel Grid.Row="0" Grid.ColumnSpan="2" Background="Blue" Orientation="Horizontal">
            <Button>Button</Button>
            <Button>Button</Button>
            <Button>Button</Button>
        </StackPanel>
        <DockPanel Grid.Row="1" Grid.Column="1">
            <Rectangle DockPanel.Dock="Right" Width="100" Fill="Red"></Rectangle>
            <Ellipse DockPanel.Dock="Left" Fill="AliceBlue"></Ellipse>
        </DockPanel>
        <ScrollViewer Grid.Row="1">
            <StackPanel>
                <Button Height="200"></Button>
                <Button Height="200"></Button>
                <Button Height="200"></Button>
                <Button Height="200"></Button>
                <Button Height="200"></Button>
                <Button Height="200"></Button>

                <Button Height="200"></Button>
                <Button Height="200"></Button>
            </StackPanel>
        </ScrollViewer>
    </Grid>

Klaraklarika