将WPF控件居中

Question

我有一个窗口，在其中添加了一个新的UserControl（带有图像），我只想将控件居中显示在屏幕中间（垂直和水平方向都要）。我只能让垂直居中的部分起作用。 我将从我的CodeBehind交换中的内容，并希望在开始执行幻灯片UI之前显示这个启动屏幕，这意味着内容是从CodeBehind设置的。

我的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>

我的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>

请注意，我正在使用最大化/全屏模式。

- H4mm3rHead

Answer 1

使用一个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>

你可以将它停靠在你的DockPanel（如果你必须在那里有一个DockPanel）内以进行拉伸。当然，虽然上面是所有的标记，但你也可以轻松地从代码中创建这样的网格。

- Pavel Minaev

---

基于XAML的框架用于在RT上编写商店应用程序并不是WPF。如果说有什么的话，它更像是Silverlight的衍生物。 - Pavel Minaev

Answer 2

我在尝试将元素居中时一直遇到这个问题。 StackPanel的问题在于，当方向为水平时，HorizontalAlignment没有效果，当方向为垂直时，VerticalAlignment没有效果。所以你会一直尝试设置没有效果的值。虽然这种工作方式并不是非逻辑的，但如果将其报告为错误就更好了。

我找到的解决方案是有两个嵌套的StackPanels，其中一个水平居中，另一个垂直居中，如下所示。需要找出父容器的大小来调整中间面板的大小，否则它会变平，并且其内容会被隐藏 - 绝对值也可以运行。虽然不是万能灵丹妙药，但比使用网格要简洁一些。

<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>

- pasx

---

好的，易于理解的想法，但需要额外的控制，但仍然是最简单的方法之一！我正在使用这个！你救了我的一天。 - Sreenikethan I

Answer 3

这是一个比较老的方法，但是将控件居中现在非常简单：

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

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

</Grid>

- MeTitus