Good day. I want my application window. On different monitors displayed the same way (preserving the proportions of the elements inside the window). For example, I began to play around with a simple dialog box. Requirements for the window are as follows: it always runs on the whole screen and displays only 4 controllers, the size of which should change proportionally depending on the monitor resolution.

<Window x:Class="testResolution.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:local="clr-namespace:testResolution" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" Title="MainWindow" WindowState="Maximized" mc:Ignorable="d"> <Window.Resources> <Style x:Key="ButtonStyle" TargetType="Button"> <Setter Property="FontSize" Value="24" /> <Setter Property="Width" Value="400" /> <Setter Property="Height" Value="100" /> <Setter Property="FontWeight" Value="Bold" /> <Setter Property="Background" Value="SlateGray" /> <Setter Property="Foreground" Value="White" /> <Setter Property="Margin" Value="10" /> </Style> </Window.Resources> <Grid> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> <RowDefinition Height="Auto" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <TextBlock Name="TicketName" Grid.Row="0" Margin="10" HorizontalAlignment="Center" VerticalAlignment="Center" Background="White" FontSize="60" Foreground="Black" Padding="5" Text="ТЕКСТ 1111" TextAlignment="Center" /> <TextBlock Name="CountPeople" Grid.Row="1" Margin="10" HorizontalAlignment="Center" VerticalAlignment="Center" Background="White" FontSize="60" Foreground="Black" Padding="5" Text="ТЕКСТ 22222" TextAlignment="Center" /> <StackPanel Grid.Row="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"> <Button Name="BtnOk" Content="Принять" Style="{StaticResource ButtonStyle}" /> <Button Name="BtnCancel" Content="Отменить" Style="{StaticResource ButtonStyle}" /> </StackPanel> </Grid> 

Tell me how to do this? Thank you in advance !!!

  • What does proportionate mean? On the screen 640x480 and 1920x1080 the picture should be proportionally stretched and only? Your loaves should occupy a third of the height or it is enough that they will be from below, occupying 400x100 each, how are you crammed in style? - Monk
  • The buttons are just below. Well, so that visually proportionally changed karinka on a different resolution. - Aldmi

2 answers 2

So that the buttons do not change the size, and the text - changed, it is worth altering the markup like this:

  <RowDefinition Height="*" /> <RowDefinition Height="*" /> <RowDefinition Height="Auto" /> 

Auto - the minimum required mode for display. * - greedy display mode, take what they give away.

  • I now think maybe even in the styles of the buttons do not explicitly set the width and height. and set only the minimum values ​​of width and height? - Aldmi
  • @Aldmi at your discretion. It is better to check live how it will behave on different settings of different controls. - Monk

If you do this

  <Grid.RowDefinitions> <RowDefinition Height="*" /> <RowDefinition Height="*" /> <RowDefinition Height="Auto" /> </Grid.RowDefinitions> 

then on a small resolution the buttons will again be big and everything else will be compressed proportionally