Включение ScrollViewer HorizontalSnapPoints с привязываемой коллекцией
Я пытаюсь создать такой же опыт, как в ScrollViewerSample из примеров Windows 8 SDK, чтобы иметь возможность привязываться к элементам в ScrollViewer при прокрутке влево и вправо. Реализация из примера (который работает) выглядит следующим образом:
<code><ScrollViewer x:Name="scrollViewer" Width="480" Height="270" HorizontalAlignment="Left" VerticalAlignment="Top" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto" ZoomMode="Disabled" HorizontalSnapPointsType="Mandatory"> <StackPanel Orientation="Horizontal"> <Image Width="480" Height="270" AutomationProperties.Name="Image of a cliff" Source="images/cliff.jpg" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top"/> <Image Width="480" Height="270" AutomationProperties.Name="Image of Grapes" Source="images/grapes.jpg" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top"/> <Image Width="480" Height="270" AutomationProperties.Name="Image of Mount Rainier" Source="images/Rainier.jpg" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top"/> <Image Width="480" Height="270" AutomationProperties.Name="Image of a sunset" Source="images/sunset.jpg" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top"/> <Image Width="480" Height="270" AutomationProperties.Name="Image of a valley" Source="images/valley.jpg" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top"/> </StackPanel> </ScrollViewer> </code>
Единственная разница с моей желаемой реализацией состоит в том, что я не хочу StackPanel с элементами внутри, но что-то, что я могу связать. Я пытаюсь сделать это с помощью ItemsControl, но по какой-то причине поведение Snap не срабатывает:
<code><ScrollViewer x:Name="scrollViewer" Width="480" Height="270" HorizontalAlignment="Left" VerticalAlignment="Top" VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto" ZoomMode="Disabled" HorizontalSnapPointsType="Mandatory"> <ItemsControl> <ItemsControl.ItemsPanel> <ItemsPanelTemplate> <StackPanel Orientation="Horizontal" /> </ItemsPanelTemplate> </ItemsControl.ItemsPanel> <Image Width="480" Height="270" AutomationProperties.Name="Image of a cliff" Source="images/cliff.jpg" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top"/> <Image Width="480" Height="270" AutomationProperties.Name="Image of Grapes" Source="images/grapes.jpg" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top"/> <Image Width="480" Height="270" AutomationProperties.Name="Image of Mount Rainier" Source="images/Rainier.jpg" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top"/> <Image Width="480" Height="270" AutomationProperties.Name="Image of a sunset" Source="images/sunset.jpg" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top"/> <Image Width="480" Height="270" AutomationProperties.Name="Image of a valley" Source="images/valley.jpg" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Top"/> </ItemsControl> </ScrollViewer> </code>
Предложения будут с благодарностью!
Благодаря Денису, я использовал следующий стиль в ItemsControl и полностью удалил ScrollViewer и встроенный ItemsPanelTemplate:
<code><Style x:Key="ItemsControlStyle" TargetType="ItemsControl"> <Setter Property="ItemsPanel"> <Setter.Value> <ItemsPanelTemplate> <VirtualizingStackPanel Orientation="Horizontal"/> </ItemsPanelTemplate> </Setter.Value> </Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ItemsControl"> <ScrollViewer Style="{StaticResource HorizontalScrollViewerStyle}" HorizontalSnapPointsType="Mandatory"> <ItemsPresenter /> </ScrollViewer> </ControlTemplate> </Setter.Value> </Setter> </Style> </code>