0

最初の列を固定した DataGrid があります。フリーズした列を別の DataGrid のように見せようとしています。フリーズした列の後にグリッド線を増やして、下の画像のようにしたいと思います。フリーズした列の後にグリッド線の幅を広げる方法がわかりません。

ここに画像の説明を入力

  <DockPanel Name="dpHistory" LastChildFill="True" sl:UIAudit.Drsarea="SuperBillHistory">
<Border Background="Blue" Grid.Column="3"/>
<DataGrid Name="dgData" CanUserAddRows="False" 
          Style="{DynamicResource DataGridRow}" 
          CellStyle="{StaticResource DataGridCellStyle}"
                  AutoGenerateColumns="False"
                         CanUserReorderColumns="False"
                         IsReadOnly="True"
                         EnableRowVirtualization="True"
                         EnableColumnVirtualization="True"
                         AlternationCount="2"
                         AlternatingRowBackground="LightSteelBlue"
                         CanUserSortColumns="False"
                         FrozenColumnCount="2"
                          BorderThickness="5">       
</DataGrid>
4

1 に答える 1

1

1 つの列を「固定」して右側に適切なガターを設ける戦略の代わりに、ガターで区切られた 2 つのデータグリッドを使用する戦略を検討できます。その意味で、それはあなたに何かを与えるだろうというあなたのコメントに従って、ここにいくつかのXamlを見てください... ここに画像の説明を入力

<Grid>
    <StackPanel Orientation="Horizontal">
        <StackPanel.Resources>
            <system:Double x:Key="HeaderHeight">26</system:Double>
            <LinearGradientBrush x:Key="GutterBrush" StartPoint="0,0" EndPoint="1,0">
                <GradientStop Color="DarkGray" Offset="0"/>
                <GradientStop Color="LightGray" Offset="1"/>
            </LinearGradientBrush>
        </StackPanel.Resources>
        <DataGrid Name="LeftMost"
                  Background="PaleTurquoise"
                  HeadersVisibility="Column"
                  ItemsSource="{Binding LeftHeaders}"
                  AutoGenerateColumns="False"
                  >
            <DataGrid.Columns>
               <DataGridTemplateColumn CanUserReorder="False" CanUserResize="False">
                   <DataGridTemplateColumn.Header>
                       <TextBlock Height="{StaticResource HeaderHeight}" Text=""/>
                   </DataGridTemplateColumn.Header>
                    <DataGridTemplateColumn.HeaderStyle>
                        <Style TargetType="DataGridColumnHeader">
                            <Setter Property="Background" Value="RosyBrown"/>
                            <Setter Property="Height" Value="{StaticResource HeaderHeight}"/>
                        </Style>
                    </DataGridTemplateColumn.HeaderStyle>
                    <DataGridTemplateColumn.CellTemplate>
                       <DataTemplate>
                           <TextBlock Width="70" Text="{Binding .}" Background="LightBlue"/>
                       </DataTemplate>
                   </DataGridTemplateColumn.CellTemplate>
               </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>
        <Rectangle Width="5" Fill="{StaticResource GutterBrush}"/>
        <DataGrid Name="RightMost"
                  Background="PowderBlue"
                  GridLinesVisibility="All"
                  >
            <DataGrid.Columns>
                <DataGridTextColumn Header="Column 1" >
                    <DataGridTextColumn.HeaderStyle>
                        <Style TargetType="DataGridColumnHeader">
                            <Setter Property="Height" Value="{StaticResource HeaderHeight}"/>
                        </Style>
                    </DataGridTextColumn.HeaderStyle>
                </DataGridTextColumn>
                <DataGridTextColumn Header="Column 2" >
                    <DataGridTextColumn.HeaderStyle>
                        <Style TargetType="DataGridColumnHeader">
                            <Setter Property="Height" Value="{StaticResource HeaderHeight}"/>
                        </Style>
                    </DataGridTextColumn.HeaderStyle>
                </DataGridTextColumn>
                <DataGridTextColumn Header="Column 3" >
                    <DataGridTextColumn.HeaderStyle>
                        <Style TargetType="DataGridColumnHeader">
                            <Setter Property="Height" Value="{StaticResource HeaderHeight}"/>
                        </Style>
                    </DataGridTextColumn.HeaderStyle>
                </DataGridTextColumn>
            </DataGrid.Columns>
        </DataGrid>
    </StackPanel>
</Grid>

このスニペットにはさまざまな色が含まれているため、どの要素が何を行っているかをより迅速に見つけることができます。しかし、示されているように、これは 2 つの DataGrid と Rectangle を含むスタック パネルです。前述のように、細心の注意を払ってスタイリングを 2 つの部分に分け、それらを 2 つの DataGrid に別々に適用する必要があります。選択やスクロールを同期させる必要がある場合は、バインディングを使用できますが、それはまた別の質問です。:)

また、最初の DataGrid を CanUserResizeColumns に設定すると、サイズを水平方向にドラッグして、スプリッターの効果を与えることができます。

このアプローチは、求めているビジュアル エクスペリエンスを提供し、元の方法よりもはるかに簡単に実装できます。全体が実装されたら、戻ってすべてのビットをコントロール テンプレートに適用できます。このアプローチを自分のトリックのバッグに追加します。

于 2013-07-17T14:33:34.833 に答える