垂直滚动条水平移动内容

Question

我正在使用带有 ItemsControl 的 Scrollviewer。 Scrollviewer 的 VerticalScrollBarVisibility 设置为 "Auto"。问题是，当滚动条出现时，它会水平移动 ItemsControl 的内容。

有没有办法让滚动条只是 "over" 内容而不移动它们？

代码看起来像这样

<ScrollViewer VerticalScrollBarVisibility="Auto" CanContentScroll="True" SnapsToDevicePixels="True">
  <ItemsControl ItemsSource="{Binding Summaries}" >
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Vertical" IsItemsHost="True" CanVerticallyScroll="True" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Grid Margin="15,5,10,5" HorizontalAlignment="Stretch">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width=".166*"></ColumnDefinition>
                    <ColumnDefinition Width=".166*"></ColumnDefinition>
                    <ColumnDefinition Width=".166*"></ColumnDefinition>
                    <ColumnDefinition Width=".166*"></ColumnDefinition>
                    <ColumnDefinition Width=".166*"></ColumnDefinition>
                    <ColumnDefinition Width=".166*"></ColumnDefinition>
                </Grid.ColumnDefinitions>
                 <Label Grid.Column="0" Content="{Binding Name}" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                <Label Grid.Column="1" Content="{Binding A}" HorizontalContentAlignment="Center"/>
                <Label Grid.Column="2" Content="{Binding B}" HorizontalAlignment="Center" HorizontalContentAlignment="Stretch"/>
                <Label Grid.Column="3" Content="{Binding C}" HorizontalAlignment="Center" HorizontalContentAlignment="Stretch"/>
                <Label Grid.Column="4" Content="{Binding D}" HorizontalAlignment="Center" HorizontalContentAlignment="Stretch"/>
                <Label Grid.Column="5" Content="{Binding E}" HorizontalAlignment="Center" HorizontalContentAlignment="Stretch"/>
            </Grid>
        </DataTemplate>                                            
    </ItemsControl.ItemTemplate>
</ItemsControl></ScrollViewer>

谢谢

Answer 1

这是我最近在项目中使用的一个技巧：

ItemsControl.Width 通过单向绑定从 ScrollViewer.ActualWidth 获得：

<ScrollViewer VerticalScrollBarVisibility="Auto" CanContentScroll="True" 
              Name="scroller"
              SnapsToDevicePixels="True">
    <ItemsControl ItemsSource="{Binding Summaries}"
                  Width="{Binding Path=ActualWidth, ElementName=scroller, Mode=OneWay}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Vertical" IsItemsHost="True" CanVerticallyScroll="True" />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <UniformGrid Columns="6" Margin="15,5,10,5" HorizontalAlignment="Stretch">
                  <Label Content="{Binding Name}" VerticalAlignment="Center" HorizontalAlignment="Left"/>
                  <Label Content="{Binding A}" HorizontalContentAlignment="Center"/>
                  <Label Content="{Binding B}" HorizontalAlignment="Center" HorizontalContentAlignment="Stretch"/>
                  <Label Content="{Binding C}" HorizontalAlignment="Center" HorizontalContentAlignment="Stretch"/>
                  <Label Content="{Binding D}" HorizontalAlignment="Center" HorizontalContentAlignment="Stretch"/>
                  <Label Content="{Binding E}" HorizontalAlignment="Center" HorizontalContentAlignment="Stretch"/>
                </UniformGrid>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</ScrollViewer>

也考虑使用 UniformGrid

垂直滚动条水平移动内容

vertical scroll bar shifts contents horizontally

wpf

scrollviewer