WPF DataGrid - 为什么会有额外的列 [英] WPF DataGrid - Why the extra column

问题描述

我有一个WPF应用程序使用 DataGrid 显示一些数据。当我运行程序时，有一个额外的列如下所示：

这是在VS2010中设计时的样子。

我已关闭数据网格上的AutoGenerateColumns，并单独指定列（这是一个用户控件）：

 < Grid Margin =10,10,10,10> 
< Grid.RowDefinitions> 
< RowDefinition Height =Auto/> 
< RowDefinition /> 
< /Grid.RowDefinitions> 
 
 
< DataGrid x：Name =EmployeeHoursAutoGenerateColumns =FalseItemsSource ={Binding EmployeeHoursLastWeek}Width =Auto> 
< DataGrid.Columns> 
< DataGridTextColumn Header =PerceptionistIDBinding ={Binding PerceptionistID}Width =100/> 
< DataGridTextColumn Header =Week OfBinding ={Binding weekOf，StringFormat = {} {0：MM / dd / yyyy}}Width =75/& 
< DataGridTextColumn Header =Regular HoursBinding ={Binding WorkHours}Width =100/> 
< DataGridTextColumn Header =PTO HoursBinding ={Binding PTOHours}Width =100/> 
< DataGridTextColumn Header =Holiday HoursBinding ={Binding HolidayHours}Width =100/> 
< /DataGrid.Columns> 
< / DataGrid> 
 
< Button x：Name =ImportHoursButtonContent =Import Hours
 Command ={Binding ImportHoursCommand}
 Height =25Width =100 Margin =10
 VerticalAlignment =BottomHorizo​​ntalAlignment =Right
 Grid.Row =1/> 
< / Grid> 
  

我也有一个MainWindowView使用注入来显示视图（这是一个常规窗口）：

 < Window x：Class =Sidekick。 MainWindow
 xmlns =http://schemas.microsoft.com/winfx/2006/xaml/presentation
 xmlns：x =http://schemas.microsoft.com/winfx/2006/ xaml
 xmlns：vm =clr-namespace：Sidekick.ViewModel
 xmlns：vw =clr-namespace：Sidekick.View
 Title =Sidekick> 
 
<！ - 通常在资源字典中完成 - > 
< Window.Resources> 
< DataTemplate DataType ={x：Type vm：EmployeeHoursViewModel}> 
< vw：EmployeeHoursView /> 
< / DataTemplate> 
< /Window.Resources> 
 
< StackPanel> 
< ItemsControl ItemsSource ={Binding ViewModels}Margin =3/> 
< / StackPanel> 
 
< / Window> 
 

在设计器中，我将MainWindowView和EmployeeHoursView都指定为Auto Size root，只是足够大，以适应网格和按钮。但是，当我运行程序时，我在数据网格中得到一个额外的列，它使程序窗口大约是EmployeeHoursView所需的两倍大（宽度和高度）。我如何编码这样，我的应用程序窗口只是足够大的EmployeeHoursView没有提供具体的值？

解决方案

额外列实际上只是未使用的空间。每个列都定义了一个Width值，所以一旦分配，就会留下剩余的空间。

如果你想摆脱那个空间，至少要做一个您的列a * 列，以便延伸以填充可用空间。

我最好的猜测为什么它看起来正常在Visual Studio中可能是因为您的设计器宽度设置为小于运行时宽度。如果它更大，你会看到同样的东西。

如果你不想让你的控制伸展，那么一定要设置它（或它的父母的）水平/垂直对齐到除Stretch以外的东西

 < StackPanel Horizo​​ntalAlignment =CenterVerticalAlignment =Center> 
< ItemsControl ItemsSource ={Binding ViewModels}Margin =3/> 
< / StackPanel> 
  

I have a WPF app that uses DataGrid to display some data. When I run the program there is an additional column as shown here:

Here is what it looks like when I design it in VS2010

I have turned off AutoGenerateColumns on the data grid and specified the columns individually as such (this is a user control):

<Grid Margin="10,10,10,10">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition />
    </Grid.RowDefinitions>


    <DataGrid x:Name="EmployeeHours" AutoGenerateColumns="False" ItemsSource="{Binding EmployeeHoursLastWeek}" Width="Auto">
        <DataGrid.Columns>
            <DataGridTextColumn Header="PerceptionistID" Binding="{Binding PerceptionistID}" Width="100" />
            <DataGridTextColumn Header="Week Of" Binding="{Binding WeekOf, StringFormat={}{0:MM/dd/yyyy}}" Width="75" />
            <DataGridTextColumn Header="Regular Hours" Binding="{Binding WorkHours}" Width="100" />
            <DataGridTextColumn Header="PTO Hours" Binding="{Binding PTOHours}" Width="100" />
            <DataGridTextColumn Header="Holiday Hours" Binding="{Binding HolidayHours}" Width="100" />
        </DataGrid.Columns>
    </DataGrid>

    <Button x:Name="ImportHoursButton" Content="Import Hours" 
            Command="{Binding ImportHoursCommand}" 
            Height="25" Width="100" Margin="10"
            VerticalAlignment="Bottom" HorizontalAlignment="Right"                
            Grid.Row="1" />
</Grid>

I also have a MainWindowView that uses injection to display the views as such (this is a regular window):

<Window x:Class="Sidekick.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:vm="clr-namespace:Sidekick.ViewModel"
        xmlns:vw="clr-namespace:Sidekick.View"
        Title="Sidekick">

    <!-- Typically done in a resources dictionary -->    
    <Window.Resources>
        <DataTemplate DataType="{x:Type vm:EmployeeHoursViewModel}">
            <vw:EmployeeHoursView />
        </DataTemplate>
    </Window.Resources>

    <StackPanel>
        <ItemsControl ItemsSource="{Binding ViewModels}" Margin="3" />
    </StackPanel>

</Window>

In the designer I have specified both MainWindowView and EmployeeHoursView as Auto Size root as I want the window to be just large enough to accommodate the grid and button. However, when I run the program I get an additional column in the data grid and it makes the program window about twice as large (both width and height) as the EmployeeHoursView needs to be. How can I code this such that my application window is just large enough for the EmployeeHoursView without providing specific values? What is causing this additional column to appear?

解决方案

The "extra column" is actually just unused space. Each of your columns define a Width value, so once they get assigned there is space left over.

If you want to get rid of that space, make at least one of your columns a * column so it stretches to fill available space.

My best guess as to why it looks normal in Visual Studio is probably because you have the designer width set to something smaller than the runtime width. If it were larger, you'd see the same thing.

If you don't want your control to stretch, then be sure to set it's (or it's parent's) horizontal/vertical alignment to something other than Stretch

<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
    <ItemsControl ItemsSource="{Binding ViewModels}" Margin="3" />
</StackPanel>

这篇关于WPF DataGrid - 为什么会有额外的列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！