ScrollViewer.CanContentScroll 不逐项滚动 ItemsControl

Question

我在 ScrollViewer 上有一个 ItemControl。我想逐项滚动，现在是逐像素滚动。

<ScrollViewer Height="299" Margin="10,10,0,0" 
HorizontalScrollBarVisibility="Visible" x:Name="Scroll"
                  VerticalAlignment="Top"  
                  Grid.Column="0" Grid.Row="1" 
                  PanningMode="HorizontalOnly" 
                  CanContentScroll="True">
        <ItemsControl ItemsSource="{Binding RelativeSource={RelativeSource AncestorType=Window}, Path=Items, Mode=OneWay}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <VirtualizingStackPanel Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Border  Width="175" Height="64" Margin="0,0,16,16" HorizontalAlignment="Center" Focusable="False">
                        <TextBlock Text="{Binding}" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                    </Border>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </ScrollViewer>

Answer 1

您可以使用 ListBox 而不是 ScrollViewer。我以为你不想要选择样式所以我改变了它。

    <ListView ScrollViewer.CanContentScroll="True" 
              ScrollViewer.VerticalScrollBarVisibility="Hidden"
              ScrollViewer.PanningMode="HorizontalOnly"
              ScrollViewer.HorizontalScrollBarVisibility="Visible"
              ItemsSource="{Binding RelativeSource={RelativeSource AncestorType=Window}, Path=Items, Mode=OneWay}">
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
        <ListView.ItemContainerStyle>
            <Style TargetType="{x:Type ListViewItem}">
                <Setter Property="Background" Value="Transparent" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ListViewItem}">
                            <ContentPresenter />
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </ListView.ItemContainerStyle>
        <ListView.ItemTemplate>
            <DataTemplate>
                <Border Width="175" Height="64" Margin="0,0,16,16" HorizontalAlignment="Center" Focusable="False">
                    <TextBlock Text="{Binding }" HorizontalAlignment="Center" VerticalAlignment="Center"/>
                </Border>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

Answer 2

只需在 ListBox 上设置此属性：

VirtualizingStackPanel.ScrollUnit ="Item"

另一种模式是"Pixel"，这是默认模式。

Answer 3

我找到了解决方案

<ItemsControl ItemsSource="{Binding TypeHeaders}" 
                                      x:Name="ActivityItemsControl" 
                                      Grid.Column="0" Grid.Row="1">
                            <ItemsControl.Template>
                                <ControlTemplate>
                                    <ScrollViewer HorizontalScrollBarVisibility="Hidden" 
                                                  VerticalScrollBarVisibility="Visible" 
                                                  CanContentScroll="True"                                                       
                                                  x:Name="ActivityScrollViewer">
                                        <ItemsPresenter/>
                                        <i:Interaction.Triggers>
                                            <i:EventTrigger EventName="ScrollChanged">
                                                <cmd:EventToCommand PassEventArgsToCommand="True" 
                                                        Command="{Binding RelativeSource={RelativeSource AncestorType={x:Type Grid}}, Path=DataContext.VmCommands.ActivityScrollChangedCommand}" />
                                            </i:EventTrigger>
                                        </i:Interaction.Triggers>
                                    </ScrollViewer>
                                </ControlTemplate>
                            </ItemsControl.Template>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <Button Content="{Binding Description}" Style="{DynamicResource ZoneTypeHeaderButtonStyle}"
                                                        Command="{Binding RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}, Path=DataContext.VmCommands.ZoneOverviewControlTypeHeaderClickedCommand}"
                                                        CommandParameter="{Binding}"/>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>

ScrollViewer.CanContentScroll 不逐项滚动 ItemsControl

ScrollViewer.CanContentScroll not scrolling ItemsControl item by item

wpf

xaml

itemscontrol

scrollviewer