Centrer un contrôle WPF

Question

J'ai une fenêtre où j'ajoute une nouvelle UserControl à (avec une image), je veux simplement centrer le contrôle au milieu de l'écran (à la fois verticalement et horizontalement). Je ne peux obtenir la verticale pour travailler. Je suis content d'échange va dans le DockPanel de mon CodeBehind et que vous souhaitez afficher cet écran de démarrage avant que je commence à faire mon interface diaporama, cela signifie que le contenu est défini à partir du CodeBehind.

Mon Window:

<Window x:Class="GreenWebPlayerWPF.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="512" Width="853" WindowStyle="None" WindowState="Maximized" WindowStartupLocation="CenterScreen">
    <DockPanel Width="Auto" Height="Auto" Name="TransitionContainer" Background="Black" Margin="0" LastChildFill="True"></DockPanel>
</Window>

Mon UserControl:

<UserControl x:Class="GreenWebPlayerWPF.FrontPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <DockPanel Background="Black">
        <Image Name="image1" Stretch="None" Source="/GreenWebPlayerWPF;component/gw.png" />
    </DockPanel>
</UserControl>

S'il vous plaît noter que je suis en utilisant l'écran maximisé / complet.

Answer 1

Utilisez un Grid:

  <Grid>  
    <Grid.ColumnDefinitions>
      <ColumnDefinition Width="*"/>
      <ColumnDefinition Width="Auto"/>
      <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
      <RowDefinition Height="*"/>
      <RowDefinition Height="Auto"/>
      <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <!-- Replace with your UserControl -->
    <Button Content="Foo" Grid.Column="1" Grid.Row="1"/>
  </Grid>

Vous pouvez la placer dans votre DockPanel (si vous devez avoir une il DockPanel) à étirer. Et, bien sûr, le plus avant tout le balisage, vous pouvez aussi créer facilement un réseau à partir du code.

Answer 2

Je continue à courir ce problème en essayant de centrer des éléments sur la page. Le problème avec le StackPanel est que HorizontalAlignment n'a pas d'effet lorsque l'orientation est horizontale et verticalAlignment aucun effet lorsque l'orientation est verticale. Donc, vous continuez à cogner la tête en essayant de définir des valeurs sans effet. Il n'est pas illogique que cela fonctionne de cette façon, mais ce serait bien si cela a été signalé comme une erreur.

La solution I est trouvé pour avoir deux StackPanels un centré horizontalement et l'autre verticalement imbriqués comme montré ci-dessous. Trouver la taille des parents est nécessaire pour la taille du panneau intermédiaire, il serait par ailleurs plat et son contenu caché - une valeur absolue fonctionnerait aussi bien. Bien que pas une panacée SITI un peu moins bavard que d'utiliser une grille.

<StackPanel Background="Bisque" Orientation="Vertical" Width="300" Height="300" >
    <StackPanel HorizontalAlignment="Center"  Orientation="Horizontal"
                  Height="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=StackPanel}, Path=ActualHeight}">
        <StackPanel VerticalAlignment="Center" Width="200" Height="60" Background="Blue">
        </StackPanel>
    </StackPanel>
</StackPanel>

Answer 3

Il est assez ancienne, mais le centrage d'un contrôle est maintenant aussi simple que:

<Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">

    <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Height="350" Width="600">
        <TextBox />
    </StackPanel>

</Grid>