Wrong button after compilation

Question

I created a simple interface for my application. Everything went well when I prepared the GUI, I use WPF and its XAML implementation. The problem arose after everything was compiled very well, and the application works. There is one button that moves when the application is running. I was looking for a problem and found nothing. Any idea on how to fix this?

The expected result is on the left, the real result is in a floating window. The XAML code of the offset button is below the floating window.

Answer 1

<Window x:Class="WPFAlignment.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525"> <Grid> <Grid.Resources> <Style TargetType="Button"> <Setter Property="Margin" Value="3"/> </Style> <Style TargetType="TextBlock"> <Setter Property="Margin" Value="3"/> </Style> </Grid.Resources> <Grid Width="500"> <Grid.RowDefinitions> <RowDefinition Height="*"/> <RowDefinition Height="2*"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Button Content="LoadFingerPrint"/> <Button Grid.Column="1" Content="Load File"/> </Grid> <Grid Grid.Row="1"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="*"/> <RowDefinition Height="*"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <TextBlock Text="File Path:" HorizontalAlignment="Left" VerticalAlignment="Center"/> <TextBlock Grid.Row="1" Text="Key Size:" HorizontalAlignment="Left" VerticalAlignment="Center"/> <TextBlock Grid.Row="2" Text="Initial Vector:" HorizontalAlignment="Left" VerticalAlignment="Center"/> <DockPanel LastChildFill="True" Grid.Column="1" Grid.ColumnSpan="3"> <TextBox Margin="2"/> </DockPanel> <Grid Grid.Column="1" Grid.ColumnSpan="3" Grid.Row="1" VerticalAlignment="Center"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <CheckBox Content="128bit" VerticalAlignment="Center" HorizontalAlignment="Left"/> <CheckBox Grid.Column="1" Content="192bit" VerticalAlignment="Center" HorizontalAlignment="Left"/> <CheckBox Grid.Column="2" Content="256bit" VerticalAlignment="Center" HorizontalAlignment="Right"/> </Grid> <DockPanel LastChildFill="True" Grid.Column="1" Grid.Row="2" Grid.ColumnSpan="3"> <TextBox Margin="2"/> </DockPanel> </Grid> <Grid Grid.Row="2"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Button Content="Encrypt"/> <Button Grid.Column="1" Content="Decrypt"/> <Button Grid.Column="2" Content="Abort"/> </Grid> </Grid> </Grid> 

Can you try this and see the alignment? You have all of these fields set manually. I think the problem.

In principle, for positioning, use containers: Grid, DockPanel, StackPanel, etc. and to be relative inside them, use Alignments, as in the VerticalAlignment example. In addition, in order to set some common values ​​for many controls, use styles, for example, I did this with the button margin.