WPF 4.0 - Datagrid列宽和&带分组的边距

时间:2014-07-06 08:14:54

标签: wpf xaml datagrid datagridviewcolumn

我遇到了与WPF数据网格中的分组相关的问题,当使用扩展器控件时,右侧边距与左侧不匹配。在向扩展器添加额外边距时,此问题更为明显。

我的目的是让每个组都作为扩展器,但在任何一侧都有边距,因此随着更多组的添加,网格列变为“挤压”#34;更多进入中心。这似乎发生在左侧,而不是右侧。

我的所有专栏都是" auto"除了设置为*的一个,以便网格列始终伸展以适合窗口。在这样做时,网格似乎无法创建右侧所需的额外空间以适合整个列集。左侧看起来很好,因为它似乎在每次创建新组时展开行选择器,将网格列进一步向右推。

目前的情况如下: http://oi58.tinypic.com/117cojb.jpg

这是我每次添加新组时的样子: http://oi62.tinypic.com/2rcn20w.jpg

在第二张图片中,我不得不手动拖动列宽以使扩展器适合屏幕上的#34;。理想情况下,我希望为每个添加的新组自动处理。


Window Xaml ......

<Window x:Class="MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow"
        Width="1000"
        Height="600">

    <Window.Resources>

        <!--  Data Grid  -->
        <Style TargetType="{x:Type DataGrid}">
            <Setter Property="BorderThickness" Value="0" />
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="RowBackground" Value="Transparent" />
            <Setter Property="AlternationCount" Value="2" />
            <Setter Property="GridLinesVisibility" Value="None" />
            <Setter Property="SelectionMode" Value="Extended" />
            <Setter Property="SelectionUnit" Value="FullRow" />
            <Setter Property="CanUserAddRows" Value="False" />
            <Setter Property="IsReadOnly" Value="True" />
            <Setter Property="AutoGenerateColumns" Value="False" />
            <Setter Property="IsSynchronizedWithCurrentItem" Value="False" />
            <Setter Property="RowHeaderWidth" Value="0" />
        </Style>

        <!--  Group Style  -->
        <Style x:Key="DefaultGroupStyle" TargetType="{x:Type GroupItem}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type GroupItem}">
                        <Expander Header="{Binding Name}" 
         Margin="10"
                                  IsExpanded="True"
                                  >
                            <ItemsPresenter />
                        </Expander>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!-- Expander -->
        <Style TargetType="{x:Type Expander}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Expander}">
                        <Grid>

                            <Border Background="LightCoral"  CornerRadius="3" Opacity="0.5" />

                            <DockPanel>

                                <StackPanel 
                                        DockPanel.Dock="Top"
                                        Orientation="Horizontal">

                                    <ToggleButton Width="20" Content=">" Margin="5" VerticalAlignment="Center" 
                                              IsChecked="{Binding Path=IsExpanded,
                                                                  RelativeSource={RelativeSource TemplatedParent}}"
                                               />

                                    <ContentPresenter  VerticalAlignment="Center" 
                                                  Content="{TemplateBinding Header}"
                                                  ContentTemplate="{TemplateBinding HeaderTemplate}"
                                                  ContentTemplateSelector="{TemplateBinding HeaderTemplateSelector}"
                                                  DockPanel.Dock="Top"
                                                  Focusable="false" />

                                </StackPanel>

                                <ContentPresenter x:Name="ExpanderContent"

                                              DockPanel.Dock="Bottom"
                                              Visibility="Collapsed" />
                            </DockPanel>

                        </Grid>

                        <ControlTemplate.Triggers>
                            <Trigger Property="IsExpanded" Value="True">
                                <Setter TargetName="ExpanderContent" Property="Visibility" Value="Visible" />
                            </Trigger>
                        </ControlTemplate.Triggers>

                    </ControlTemplate>
                </Setter.Value>
            </Setter>

        </Style>

    </Window.Resources>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <DataGrid x:Name="IssuesGrid"
                  Margin="20"
                  ItemsSource="{Binding}">
            <DataGrid.Columns>

                <DataGridTextColumn Width="Auto"
                                    Binding="{Binding ID}"
                                    CanUserSort="False"
                                    Header="ID" />
                <DataGridTextColumn Width="Auto"
                                    Binding="{Binding Customer}"
                                    CanUserSort="False"
                                    Header="Customer" />
                <DataGridTextColumn Width="*"
                                    Binding="{Binding Title}"
                                    CanUserSort="False"
                                    Header="Title" />
                <DataGridTextColumn Width="Auto"
                                    Binding="{Binding AssignedTo}"
                                    CanUserSort="False"
                                    Header="Assigned To" />
            </DataGrid.Columns>

            <DataGrid.GroupStyle>
                <GroupStyle ContainerStyle="{StaticResource DefaultGroupStyle}">
                    <GroupStyle.Panel>
                        <ItemsPanelTemplate>
                            <DataGridRowsPresenter />
                        </ItemsPanelTemplate>
                    </GroupStyle.Panel>
                </GroupStyle>
            </DataGrid.GroupStyle>

        </DataGrid>

        <StackPanel Grid.Row="1"
                    HorizontalAlignment="Center"
                    Orientation="Horizontal">
            <Button x:Name="btnGroup1"
                    Width="Auto"
                    Margin="5"
                    Content="Add  Group" />

        </StackPanel>

    </Grid>
</Window>

守则背后......

Imports System.ComponentModel
Imports System.Collections.ObjectModel

Public Class MainWindow

    Public Items As New IssueCollection

    Private Sub MainWindow_Loaded(sender As Object, e As RoutedEventArgs) Handles Me.Loaded

        Items.Add(New Issue With {.ID = "1234", .AssignedTo = "John Doe", .Customer = "Customer A", .Title = "A long title to take up a good amount of space"})
        Items.Add(New Issue With {.ID = "1234", .AssignedTo = "John Doe", .Customer = "Customer A", .Title = "A long title to take up a good amount of space"})
        Items.Add(New Issue With {.ID = "1234", .AssignedTo = "John Doe", .Customer = "Customer B", .Title = "A long title to take up a good amount of space"})
        Items.Add(New Issue With {.ID = "1234", .AssignedTo = "John Doe", .Customer = "Customer B", .Title = "A long title to take up a good amount of space"})
        Items.Add(New Issue With {.ID = "1234", .AssignedTo = "John Doe", .Customer = "Customer B", .Title = "A long title to take up a good amount of space"})

        IssuesGrid.ItemsSource = CollectionViewSource.GetDefaultView(Items)

    End Sub

    Private Sub btnGroup1_Click(sender As Object, e As RoutedEventArgs) Handles btnGroup1.Click
        CType(IssuesGrid.ItemsSource, ICollectionView).GroupDescriptions.Add(New PropertyGroupDescription("Customer"))
    End Sub

End Class

Public Class Issue
    Public Property ID As String
    Public Property AssignedTo As String
    Public Property Customer As String
    Public Property Title As String

End Class

Public Class IssueCollection
    Inherits ObservableCollection(Of Issue)
    Implements INotifyPropertyChanged

    Public Sub New()
    End Sub

End Class

关于如何解决这个问题的任何想法? - 我试图改变所有级别(即列,行演示者和扩展器)的边距和填充,但没有运气。

谢谢。

1 个答案:

答案 0 :(得分:1)

我对小组风格做了一点调整

    <!--  Group Style  -->
    <Style x:Key="DefaultGroupStyle" TargetType="{x:Type GroupItem}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type GroupItem}">
                    <Grid Width="{Binding ActualWidth,RelativeSource={RelativeSource TemplatedParent}}">
                        <Expander Header="{Binding Name}" Margin="10" IsExpanded="True">
                            <ItemsPresenter />
                        </Expander>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

我将扩展器封装在网格中并将其宽度绑定到容器的宽度,这最终将限制孩子变大

然而这种方法有一个限制,即这不会重新定位网格列,所以可能有一些艺术品,我认为可以单独处理

结果

result