WPF UserControl 填充主窗口答案

【问题标题】：WPF UserControl fill mainwindowWPF UserControl 填充主窗口
【发布时间】：2016-03-16 16:19:44
【问题描述】：

我无法让我的 UserControl 正确填充/调整父窗口的大小。我正在使用 MVVM 编写 WPF 应用程序。我已经搜索了其他答案，但我无法弄清楚。

MainWindow.xaml

<Window x:Class="QiXR.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:vm="clr-namespace:QiXR.ViewModel"
    xmlns:vw="clr-namespace:QiXR.View"
    Title="MainWindow">
<Window.Resources>
    <DataTemplate DataType="{x:Type vm:XRTestCaseListViewModel}">
        <vw:XRTestCaseListView/>
    </DataTemplate>

</Window.Resources>
<Grid>
    <ItemsControl ItemsSource="{Binding ViewModels}" />
</Grid>

用户控制

<UserControl x:Class="QiXR.View.XRTestCaseListView"
         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"
         VerticalAlignment="Stretch" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
<UserControl.Resources>
    <Style x:Key="DataGridCheckBoxStyle" TargetType="CheckBox" BasedOn="{StaticResource {x:Type CheckBox}}">
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="HorizontalAlignment" Value="Center"/>
    </Style>
</UserControl.Resources>

<Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="160"/>
        <ColumnDefinition Width="160"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="30"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="45"/>
    </Grid.RowDefinitions>

这是我启动时的显示效果 UserControl in MainWindow

是否可以在 UserControl 或 MainWindow 的 xaml 中执行此操作？谢谢

【问题讨论】：

看起来应该是这样。 ItemsControl 中的项目根据它们自己的高度调整大小。为什么将它放在 ItemsControl 中？您是否希望其中有多个不同的视图？
当您说您希望按钮下方的空间被折叠时，您的意思是窗口高度应该是项目控件和按钮的大小吗？或者按钮应该位于窗口底部并且窗口保持固定大小？
@Will 是的，我打算拥有多个视图（特别是 3 个）。我根据 Rachel 在下面的建议更改了 ItemsPanelTemplate 并实现了我正在寻找的行为。但是，我一般不习惯使用 ItemsControl，这只是我在 google 搜索时发现的。（顺便说一句，这里的总菜鸟）。我愿意接受有关其他显示视图方式的建议:)
@JayT 我在寻找前者而不是后者。

标签： c# wpf mvvm viewusercontrol

【解决方案1】：

ItemsControl 默认使用StackPanel 来显示数据，StackPanel 将其大小限制为其子项的大小。

如果您的ViewModels 集合中只有一项，请尝试将ItemsPanelTemplate 切换为DockPanel 之类的东西：

<ItemsControl ItemsSource="{Binding ViewModels}">
    <!-- ItemsPanelTemplate -->
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <DockPanel />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
</ItemsControl>

如果您计划拥有多个项目，您还必须为DockPanel.Dock="Top" 设置ItemContainerStyle 属性，可能使用转换器，因此最后一个项目是DockPanel.Dock="Fill"。或者切换到使用其他面板类型，该面板类型也可以拉伸以填充所有可用空间，并允许其子项也可以拉伸。

也就是说，如果您只显示一项，我建议您改用 ContentControl 而不是 ItemsControl。

<ContentControl Content="{Binding MyViewModel}" />

【讨论】：

改变 ItemsPanelTemplate 成功了！谢谢拉格尔！

【解决方案2】：

如果您希望窗口与内容（包括 ItemsControl 下方的菜单和按钮）的大小相同，并且可以选择在有更多内容时使窗口变大，您可以设置 SizeToContent 属性：

<Window x:Class="Project.Window"
    x:Name="userControl"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Width="400" MaxHeight="700"
    SizeToContent="Height" WindowStartupLocation="CenterScreen">

</Window>

窗口将增加高度以适应其内容。在那里，您还可以设置 MaxHeight 属性，这样如果 ItemsControl 中有很多项目，窗口就不会变得太大。

【讨论】：