网格/滚动查看器-冻结网格标题行垂直滚动，但不水平滚动

Question

我不使用DataGrid或ListView，而是使用ScrollViewer和网格创建包含每个单元格列项目包装面板的单元格。

我希望有类似于datagrid或listview的头列的东西，在垂直滚动下面的项目时保持冻结，但是让它水平滚动。

我现在有下面这个主窗口的根目录，除了当有一个垂直滚动条显示时，项目的对齐是关闭的。

备注：

• 头列在后面的代码中动态添加到下面的"mainGrid“中，每个列的大小为"1*”，并通过允许水平滚动条但禁用垂直滚动条而“冻结”。然后添加一个
• 内部滚动查看器，禁用水平滚动，但允许内部“行分组”的垂直滚动。
• ItemsControl的ItemTemplate为跨列的每个“行分组”创建一个网格。

因此，当"innerScrollViewer“显示它的垂直滚动条时，项目不再与外部列标题对齐，并且由于右边的垂直滚动条，项目被移到左边。如何让它与外部列标题动态地对齐，用于显示或不显示垂直滚动条的两种情况？

<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled">
        <Grid x:Name="mainGrid"
              Width="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ScrollViewer}}, Path=ViewportWidth}">
    <RowDefinitions>
        <RowDefinition Height="Auto" />     <!-- Contains Header columns dynamically added to be "frozen" -->
        <RowDefinition Height="*" />        <!-- "row groupings" -->
    </RowDefinitions>

            <ScrollViewer x:Name="innerScrollViewer"
                          HorizontalScrollBarVisibility="Disabled"
                          VerticalScrollBarVisibility="Auto"                          
                          Grid.Row="1"
                          Grid.ColumnSpan="{Binding Path=NumColumns}">

        <ItemsControl Name="mainWorkItemsItemsControl"
                  Width="{Binding ActualWidth, ElementName=mainGrid}"
                                  ItemsSource="{Binding MyGroups}"
                                  ItemTemplate="{StaticResource groupedTemplate}" />                    

            </ScrollViewer>
    </Grid>
</ScrollViewer>


<DataTemplate x:Key="groupedTemplate">

    <ItemsControl ItemsSource="{Binding GroupItems}">

                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <!-- Creates a grid with one row and the same number of columns as "mainGrid" above with a star sizing for each column  -->
                            <SimpleGrid Rows="Auto" 
                                        Columns="{p:PyBinding CommaDelimit($[.NumColumns]\, \'*\')}" />
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>

                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                <ItemsControl ItemsSource="{Binding Path=GroupedColumnItems}">                                    
                                    <ItemsControl.ItemTemplate>
                                        <DataTemplate>
                        <MyControl />                                              
                                        </DataTemplate>
                                    </ItemsControl.ItemTemplate>
                                </ItemsControl>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>

                    <ItemsControl.ItemContainerStyle>
                        <Style>
                            <Setter Property="Grid.Column"
                                    Value="{Binding Path=Index}" />
                        </Style>
                    </ItemsControl.ItemContainerStyle>

    </ItemsControl>

</DataTemplate>

Answer 1

你有三个选择。

默认情况下，

1. 使滚动查看器(头部和内部)都可以看到垂直滚动条，因此当内部滚动查看器需要垂直滚动时，只需启用垂直滚动条就可以不占用任何空间。
2. 绑定标题中每个列的宽度属性和行中网格中的相应列。因此，当行网格的列的宽度发生变化时，也会更改相应的标头列的宽度。这还将帮助您为用户提供工具，通过拖动其边框来重新调整列的大小。但这需要更多的代码。
3. 使内滚动查看器的垂直条可见，并在页眉上设置右边距，等于垂直滚动条的宽度。