Question

我最近开始使用MVVM开发一个小型WPF项目。

但是我遇到了一些麻烦，让我的ItemsControl遍布整个MainWindow。它按预期水平工作，但垂直方向不起作用。

当我在ItemControl的视图中更改DesignHeight时，它按预期方式展开，因此我很想相信问题出在MainWindow中。

MainWindow的XAML：

<Window x:Class="PhoneDirectoryEditor.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:PhoneDirectoryEditor"
        xmlns:vm="clr-namespace:PhoneDirectoryEditor.ViewModel"
        xmlns:vw="clr-namespace:PhoneDirectoryEditor.View"
        mc:Ignorable="d"
        Title="MainWindow" Height="500" Width="660" d:DataContext="{d:DesignInstance vm:MainWindowViewModel}" MinHeight="400" MinWidth="400">
    <Window.Resources>
        <DataTemplate DataType="{x:Type vm:DirectoryEntryListViewModel}">
            <vw:DirectoryEntryListView/>
        </DataTemplate>
    </Window.Resources>
    <Grid Margin="4">
        <ItemsControl ItemsSource="{Binding ViewModels}"/>
    </Grid>
</Window>

ItemControl的XAML：

<UserControl x:Class="PhoneDirectoryEditor.View.DirectoryEntryListView"
             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" 
             xmlns:local="clr-namespace:PhoneDirectoryEditor.View"
             xmlns:viewModel="clr-namespace:PhoneDirectoryEditor.ViewModel"
             mc:Ignorable="d" 
             d:DataContext="{d:DesignInstance viewModel:DirectoryEntryListViewModel}" d:DesignWidth="512" d:DesignHeight="383">

    <UserControl.Resources>
        <!--body content datagrid cell vertical centering-->
        <Style x:Key="BodyContentDataGridCentering" TargetType="{x:Type DataGridCell}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type DataGridCell}">
                        <Grid Background="{TemplateBinding Background}">
                            <ContentPresenter VerticalAlignment="Center" />
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

    <Grid Background="GhostWhite">
        <DataGrid Grid.Row="0" Grid.Column="0" ItemsSource="{Binding AllDirectoryEntries}" CanUserReorderColumns="False" CanUserResizeRows="False" SelectionMode="Single" AutoGenerateColumns="False" RowDetailsVisibilityMode="Collapsed" HeadersVisibility="Column" GridLinesVisibility="Horizontal" CanUserAddRows="False" Margin="3,3,3,46" MaxHeight="400">
            <DataGrid.Columns>
                <DataGridTextColumn CellStyle="{StaticResource BodyContentDataGridCentering}" Binding="{Binding Name}" ClipboardContentBinding="{x:Null}" Header="Name" Width="*"/>
                <DataGridTextColumn CellStyle="{StaticResource BodyContentDataGridCentering}" Binding="{Binding PhoneNumber}" ClipboardContentBinding="{x:Null}" Header="Phone number" Width="*"/>
                <DataGridTemplateColumn Header="Delete Contact" Width="100">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Button Content="Delete" Tag="{Binding}" Margin="2"/>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>

        <Button Content="Search" Tag="{Binding}" Margin="150,0,0,9" HorizontalAlignment="Left" Width="87" Height="23" VerticalAlignment="Bottom"/>
        <TextBox Grid.Column="0" x:Name="textBox" TextWrapping="Wrap" Text="TextBox" Margin="3,0,0,9" Height="23" VerticalAlignment="Bottom" HorizontalAlignment="Left" Width="140"/>
        <Button Content="New" Tag="{Binding}" Margin="0,0,3,9" HorizontalAlignment="Right" Width="104" Height="23" VerticalAlignment="Bottom"/>

    </Grid>
</UserControl>

避免混淆的图片：http://i.imgur.com/PQGJQT2.png

Answer 1

在ItemsControl上，您可以指定VerticalContentAlignment至Stretch。

<ItemsControl VerticalContentAlignment="Stretch" ...

另外，请确保您的UserControl没有受限制的高度。从我现在看到的情况来看，您正在设置DataGrid上的最大高度：

Margin="3,3,3,46" MaxHeight="400"

Answer 2

我摆脱了数据网格MaxHeight="400"

的最大高度

 <DataGrid Grid.Row="0" Grid.Column="0" ItemsSource="{Binding AllDirectoryEntries}" CanUserReorderColumns="False" CanUserResizeRows="False" SelectionMode="Single" AutoGenerateColumns="False" RowDetailsVisibilityMode="Collapsed" HeadersVisibility="Column" GridLinesVisibility="Horizontal" CanUserAddRows="False" Margin="3,3,3,46" MaxHeight="400">

它对我有用

Answer 3

将您的DataGrid和这两个按钮与其文本框一起放在DockPanel中，其LastChildFill = true。

根据前面提到的属性，你的DataGrid应该被添加为DockPanel的最后一个子节点，所以将这3个控件添加到一个水平方向的StackPanel中，然后放置你的DataGrid。

这是一个如何工作的例子：

<Window x:Class="GridHeightStack.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:system="clr-namespace:System;assembly=mscorlib"
    Title="MainWindow" Height="350" Width="525">
<DockPanel LastChildFill="True">
    <DockPanel.Resources>
        <x:Array Type="system:String" x:Key="days">
            <system:String>Item1</system:String>
            <system:String>Item2</system:String>
            <system:String>Item3</system:String>
            <system:String>Item4</system:String>
            <system:String>Item5</system:String>
            <system:String>Item6</system:String>
        </x:Array>
    </DockPanel.Resources>
    <DockPanel  DockPanel.Dock="Bottom" Height="30">
        <TextBox Width="100" Text="test text" />
        <Button  Content="Search"/>
        <Button  Content="New" HorizontalAlignment="Right"/>
    </DockPanel>
    <Border BorderBrush="Brown" BorderThickness="2">
        <DataGrid ItemsSource="{StaticResource days}" FontSize="30" AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{Binding}"/>
            </DataGrid.Columns>

        </DataGrid>
    </Border>
</DockPanel>

结果：

enter image description here

我已经为DataGrid的边框着色，因此您可以看到它已展开并且底部项目保留在其位置。

无法使WPF ItemsControl垂直拉伸

3 个答案: