如何獲取WPF ContentControl內容？

Question

我正在使用ContentControl動態呈現各種UserControl派生。 我不能為我的生活弄清楚如何在調整父Window時調整內容。 我發現像許多人提到這個 ，但它仍然不是為我工作。 這是一個簡單的例子：

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

這是運行時的樣子：

我在這里錯過了什么？ 我如何讓子內容的行為使其保持錨定在父級的頂部/左側，而在父級調整大小時，底部/右側伸展？

Answer 1

兩件事情：

首先，您要刪除ContentControl上的VerticalAlignment和HorizontalAlignment 。 設置這些將阻止內容控件在其容器內拉伸，因此Width和Height被尊重，默認情況下均為零（因此容器本身沒有大小）。

將VerticalAlignment和HorizontalAlignment設置為Stretch ，或者將其保留為默認值，將使容器填充網格，這就是您想要的。

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

其次，在UserControl設置Width和Height會將其大小設置為固定大小，因此不會自行調整。 刪除這些屬性，用戶控件默認也會拉伸，使其填充內容控件。

如果您想為設計目的設置一定的尺寸，請設置設計尺寸而不是實際控制尺寸。 為此，您擁有包含DesignWidth和DesignHeight屬性的d XAML命名空間。 設置這些將影響設計器，但稍后在渲染視圖時將忽略它們。

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