使用WrapPanel和ScrollViewer在ListBox中包裝圖像，所選項目消失！

Question

我正在使用ListBox來顯示800個縮略圖的水平顯示，但每次只能顯示6個（取決於屏幕分辨率），我想要使用列表中任一側的按鈕移動圖像。

我目前有這個工作，但是當我將列表框的SelectedItem更改爲下一個/上一個縮略圖時，ScrollViewer不會自動將SelectedItem保留在視圖中。 6個縮略圖之後的SelectedItem將會消失。

我可以移動ScrollBar以查看SelectedItem，但那不夠好，在最終版本中，我甚至不需要ScrollBar，我只是希望用戶能夠按住左或右按鈕並且它在照片中閃過。

也只是爲了給你爲什麼我想要這個，每當SelectedItem在ListBox上被改變，它都會改變上面的照片的FullSize預覽。

Silverlight 2中是否有確保ScrollViewer（在ListBox中）中的SelectedItem保留在可視區域中的方法？

這裏有一個列表框當前XAML：

<ListBox x:Name="lbPhotos" 
     ItemsSource="{Binding Photos}" 
     SelectedItem="{Binding Path=SelectedPhoto, Mode=TwoWay}" 
     ItemContainerStyle="{StaticResource ReflectionListBoxItemStyle}"> 

    <ListBox.ItemsPanel> 
     <ItemsPanelTemplate> 
      <controls:WrapPanel Margin="0" /> 
     </ItemsPanelTemplate> 
    </ListBox.ItemsPanel> 

    <ListBox.Template> 
     <ControlTemplate> 
      <Grid> 
       <ScrollViewer VerticalScrollBarVisibility="Hidden" HorizontalScrollBarVisibility="Hidden" 
           BorderThickness="0" MaxHeight="170"> 
        <ItemsPresenter /> 
       </ScrollViewer> 
      </Grid> 
     </ControlTemplate> 
    </ListBox.Template> 

    <ListBox.ItemTemplate> 
     <DataTemplate> 
      <Image MaxHeight="85" Source="{Binding ThumbnailUrl, Converter={StaticResource UrlToBitmapImageConverter}}" /> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 

    </ListBox> 

產品容器的風格是在這裏：

<Style x:Key="ReflectionListBoxItemStyle" TargetType="ListBoxItem"> 
     <Setter Property="Padding" Value="3"/> 
     <Setter Property="HorizontalContentAlignment" Value="Left"/> 
     <Setter Property="VerticalContentAlignment" Value="Top"/> 
     <Setter Property="Background" Value="Transparent"/> 
     <Setter Property="BorderThickness" Value="1"/> 
     <Setter Property="TabNavigation" Value="Local"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="ListBoxItem"> 
        <Grid Background="{TemplateBinding Background}"> 
         <vsm:VisualStateManager.VisualStateGroups> 
          <vsm:VisualStateGroup x:Name="CommonStates"> 
           <vsm:VisualState x:Name="Normal"/> 
           <vsm:VisualState x:Name="MouseOver"> 
            <Storyboard> 
             <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="MainContentBorder" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)"> 
              <SplineColorKeyFrame KeyTime="00:00:00" Value="{StaticResource PinkColor}"/> 
             </ColorAnimationUsingKeyFrames> 
             <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="ReflectionBorder" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)"> 
              <SplineColorKeyFrame KeyTime="00:00:00" Value="{StaticResource PinkColor}"/> 
             </ColorAnimationUsingKeyFrames> 
            </Storyboard> 
           </vsm:VisualState> 
           <vsm:VisualState x:Name="Disabled"> 
           </vsm:VisualState> 
          </vsm:VisualStateGroup> 
          <vsm:VisualStateGroup x:Name="SelectionStates"> 
           <vsm:VisualState x:Name="Unselected"/> 
           <vsm:VisualState x:Name="Selected"> 
            <Storyboard> 
             <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="MainContentBorder" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)"> 
              <SplineColorKeyFrame KeyTime="00:00:00" Value="{StaticResource PinkColor}"/> 
             </ColorAnimationUsingKeyFrames> 
             <ColorAnimationUsingKeyFrames BeginTime="00:00:00" Duration="00:00:00.0010000" Storyboard.TargetName="ReflectionBorder" Storyboard.TargetProperty="(Border.BorderBrush).(SolidColorBrush.Color)"> 
              <SplineColorKeyFrame KeyTime="00:00:00" Value="{StaticResource PinkColor}"/> 
             </ColorAnimationUsingKeyFrames> 
            </Storyboard> 
           </vsm:VisualState> 
          </vsm:VisualStateGroup> 
          <vsm:VisualStateGroup x:Name="FocusStates"> 
           <vsm:VisualState x:Name="Focused"> 
           </vsm:VisualState> 
           <vsm:VisualState x:Name="Unfocused"/> 
          </vsm:VisualStateGroup> 
         </vsm:VisualStateManager.VisualStateGroups> 
         <StackPanel Orientation="Vertical" Margin="0,0,4,0"> 
         <!-- Image --> 
           <Border HorizontalAlignment="{TemplateBinding HorizontalAlignment}" BorderThickness="3,3,3,2" CornerRadius="1" x:Name="MainContentBorder" VerticalAlignment="{TemplateBinding VerticalAlignment}"> 
            <Border.BorderBrush> 
             <SolidColorBrush Color="#00000000"/> 
            </Border.BorderBrush> 
            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/> 
           </Border> 

           <!-- Image reflection --> 
           <Border RenderTransformOrigin="0.5,0.5" BorderThickness="3,2,3,3" CornerRadius="1" VerticalAlignment="{TemplateBinding VerticalAlignment}" Margin="0,2,0,0" x:Name="ReflectionBorder" HorizontalAlignment="{TemplateBinding HorizontalAlignment}"> 
            <Border.BorderBrush> 
             <SolidColorBrush Color="#00000000"/> 
            </Border.BorderBrush> 
            <Border.OpacityMask> 
             <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> 
              <GradientStop Color="#66000000" Offset="1"/> 
              <GradientStop Color="#00000000" Offset="0.348"/> 
             </LinearGradientBrush> 
            </Border.OpacityMask> 
            <Border.RenderTransform> 
             <TransformGroup> 
              <ScaleTransform ScaleY="-1"/> 
             </TransformGroup> 
            </Border.RenderTransform> 
            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/> 
          </Border> 
          </StackPanel> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Answer 1

我結束了使用ScrollViewer.ScrollToHorizo​​ntalOffset作爲ScrollIntoView沒有工作

Answer 2

你可以使用ScrollIntoView方法傳遞所選擇的項目。

​​