Responsive UI for WpF application

Question

I am trying to create a responsive design for my wpf application but having issue.Because when i am resizing it.it is not working.So can anyone help me out.

trying to adjust the screen based on different sizes to see if any components are reacting to that. Unfortunately they don't I am not sure what I am missing

 <Window x:Class="LSLABAPP.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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:local="clr-namespace:LSLABAPP"
            mc:Ignorable="d"
            Title="MainWindow" Height="300" Width="525" MinHeight="300" MinWidth="525" ResizeMode="CanResizeWithGrip">
        <Grid>
            <Grid.Background>
                <ImageBrush/>
            </Grid.Background>
            <Grid.RowDefinitions>
                <RowDefinition MinHeight="80" Height="50"></RowDefinition>
                <RowDefinition MinHeight="40" Height="40"></RowDefinition>
                <RowDefinition MinHeight="40" Height="40*"></RowDefinition>
                <RowDefinition MinHeight="40" Height="40*"></RowDefinition>
                <RowDefinition MinHeight="40" Height="40*"></RowDefinition>
                <RowDefinition MinHeight="40" Height="40*"></RowDefinition>
                <RowDefinition MinHeight="40" Height="40*"></RowDefinition>


            </Grid.RowDefinitions>

            <Grid.ColumnDefinitions>

                <ColumnDefinition MinWidth="100" Width="100"></ColumnDefinition>

                <ColumnDefinition Width="417"/>
                <ColumnDefinition Width="0"/>

            </Grid.ColumnDefinitions>
            <TextBox x:Name="UserName" Grid.Column="1" HorizontalAlignment="Left" Height="25" Margin="30,10,0,0" Grid.Row="2" TextWrapping="Wrap" Text="UserName" VerticalAlignment="Top" Width="172"/>
            <PasswordBox x:Name="Password" Grid.Column="1" HorizontalAlignment="Left"   Margin="30,10,0,0" Grid.Row="3" VerticalAlignment="Top" Width="172" Height="25"/>
            <Label x:Name="UsernameLable" Content="UserName" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="2"
                   Grid.Column="0" VerticalAlignment="Top" Width="81" Height="26"/>
            <Label x:Name="PasswordLable" Content="Password" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="3"
                   Grid.Column="0" VerticalAlignment="Top" Width="81" RenderTransformOrigin="0.333,2.038" Height="26"/>
            <Canvas Grid.Column="1" HorizontalAlignment="Left" Height="80" VerticalAlignment="Top" Width="417" Background="#FF4E79EE">
                <Label x:Name="label" Content="Testing" Canvas.Left="70" Canvas.Top="10" Width="260" Foreground="White" FontWeight="Bold"/>
                <Label x:Name="label1" Content="DEV Environment" Canvas.Left="130" Canvas.Top="36" Foreground="red" FontWeight="Bold"/>
            </Canvas>
            <Canvas HorizontalAlignment="Left" Height="80" VerticalAlignment="Top" Width="100" Background="#FF4E79EE" />
            <Image Margin="0,0,414,0" Grid.ColumnSpan="2">
                <Image.Source>
                    <BitmapImage  UriSource="Content/.ng" />
                </Image.Source>
            </Image>



        </Grid>
    </Window>

you need to avoid hard coding Height and Width values in WPF.. use Max Height, MaxWidth and proportional sizing. — Redouane, Oct 05 '17 at 15:57

dstreissi · Answer 1 · 2017-10-05T15:57:56.717

0

when you set a fixed height or width, then wpf won't resize.

But maybe this is a duplicate question to How to make all controls resize accordingly proportionally when window is maximized?

edited Oct 05 '17 at 15:57

answered Oct 05 '17 at 15:50

dstreissi

209
3
14

Responsive UI for WpF application

1 Answers1