Nieprawidłowy przycisk po kompilacji

Question

Tworzyłem prosty interfejs dla mojej aplikacji. Wszystko poszło dobrze, gdy przygotowałem projekt GUI, używam WPF i jego implementacji XAML. Problem pojawił się, gdy wszystko skompilowane bardzo dobrze i aplikacja działa. Jest jeden przycisk, który jest źle ustawiony, gdy aplikacja działa. Szukałem problemu i nic nie znalazłem. Każdy pomysł, jak to naprawić?

Oczekiwany wynik znajduje się po lewej stronie, rzeczywisty wynik dotyczy ruchomego okna. Kod XAML niewspółosiowego przycisku znajduje się poniżej ruchomego okna.

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> 

można spróbować i zobaczyć wyrównania? Wszystkie te marginesy są ustalane ręcznie. Myślę, że to jest problem.

Zasadniczo do pozycjonowania użyj kontenerów: Grid, DockPanel, StackPanel i tak dalej, aby zachować względną wartość wewnątrz, użyj opcji Alignments, jak w przykładzie VerticalAlignment. Ponadto, aby ustawić jakąś wspólną wartość dla wielu Kontrolek, użyj Stylów, tak jak zrobiłem z Margin of the Button.