Question

我使用ContentControl动态呈现各种UserControl推导。我不能为我的生活找出当我调整父Window的大小时如何让内容延伸。我找到了许多像this这样的引用，但它仍然不适合我。这是一个简单的例子：

这是Window XAML：

<Window x:Class="WpfApplication3.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">
    <Window.Resources>
        <ResourceDictionary Source="Dictionary1.xaml"/>
    </Window.Resources>
    <Grid>
        <ContentControl VerticalAlignment="Top" 
                        HorizontalAlignment="Left" 
                        VerticalContentAlignment="Stretch" 
                        HorizontalContentAlignment="Stretch" 
                        Content="{Binding Path=ChildView}" 
                        Margin="10"/>
    </Grid>
</Window>

这使用资源文件Dictionary1.XAML：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:viewModels ="clr-namespace:WpfApplication3"
                    xmlns:views ="clr-namespace:WpfApplication3">

    <DataTemplate DataType="{x:Type viewModels:UserControlViewModel}">
        <views:UserControl1/>
    </DataTemplate>
</ResourceDictionary>

以下是主Window以及视图模型类的代码：

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        this.DataContext = new MainViewModel();
    }
}    

public class MainViewModel
{
    public UserControlViewModel ChildView { get; set; }

    public MainViewModel()
    {
        ChildView = new UserControlViewModel();
    }
}

public class UserControlViewModel
{

}

最后是用户控件：

<UserControl x:Class="WpfApplication3.UserControl1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             Background="Blue" 
             Height="141" Width="278" 
             VerticalAlignment="Stretch" 
             HorizontalAlignment="Stretch">
    <Grid>

    </Grid>
</UserControl>

这是运行时的样子：

enter image description here

我在这里缺少什么？如何使子内容的行为使其保持锚定在父级的顶部/左侧，并在父级调整大小时从下/右伸展？

Answer 1

两件事：

首先，您要删除VerticalAlignment上的HorizontalAlignment和ContentControl。设置这些将阻止内容控件在其容器内拉伸，因此Width和Height被尊重，默认情况下都为零（因此容器本身没有大小）。

将VerticalAlignment和HorizontalAlignment设置为Stretch，或将其保留为默认设置，将使容器填满网格，这就是您想要的。

<ContentControl Content="{Binding Path=ChildView}" Margin="10" />

其次，在Width中设置Height和UserControl会将其大小设置为固定大小，因此不会自行调整。删除这些属性，用户控件默认也会拉伸，使其填充内容控件。

如果您想为设计目的设置一定的尺寸，请设置设计尺寸而不是实际的控件尺寸。为此，您拥有d XAML命名空间，其中包含DesignWidth和DesignHeight属性。设置它们会影响设计器，但稍后在渲染视图时会忽略它们。

<UserControl x:Class="WpfApplication3.UserControl1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008" mc:Ignorable="d"
        d:DesignWidth="400" d:DesignHeight="250"
        Background="Blue">
    …
</UserControl>

Answer 2

您可以设置UserControl的Height和Width属性。这消除了WPF布局的任何余地。因此它可以做到最好，它将UserControl集中在一起。如果移除宽度和高度，它应该按预期拉伸。

<UserControl x:Class="WpfApplication3.UserControl1"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         Background="Blue" 
         Height="141" Width="278" //<-- remove 
         VerticalAlignment="Stretch" 
         HorizontalAlignment="Stretch">
<Grid>

</Grid>
</UserControl>

正如poke温馨地提醒我，你还必须删除VerticalAlignment="Top"和HorizontalAlignment="Left"

<ContentControl VerticalAlignment="Top" //<--remove
                    HorizontalAlignment="Left"  //<--remove
                    VerticalContentAlignment="Stretch" 
                    HorizontalContentAlignment="Stretch" 
                    Content="{Binding Path=ChildView}" 
                    Margin="10"/>

如何获取WPF ContentControl内容？

2 个答案: