2009-05-20 12 views
2

私はListBoxを使って800個のサムネイルの横表示を表示していますが、画面解像度に応じて一度に6枚しか表示できません。リストの両側にあるボタンを使用して画像を移動します。WrapPanelとScrollViewerを使用してListBoxに画像をラップすると、選択した項目が消えます!

私は現在、この機能を持っていますが、リストボックスのSelectedItemを次/以前のサムネイルに変更すると、ScrollViewerはSelectedItemを自動的に表示しません。 6つのサムネイルの後にSelectedItemが消えるだけです。

私はScrollBarを移動してSelectedItemを見ることができますが、それは十分ではありません。最終バージョンでは私はScrollBarを必要としません。ユーザーはLeftまたはRightボタンを押し続けることができますそれは写真を通してblitses。

また、なぜ私はこれをしたいのですか?ListBoxでSelectedItemが変更されるたびに、上の写真の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> 

答えて

0

のscrollIntoViewが

+0

私はまさにこの問題を抱えています。どのようにHorizo​​ntalOffsetを計算しましたか?インデックスを取得し、サムネイルの幅を合計するだけです。 –

+0

まさに私がやったこと – Ash

1

あなたが選択したアイテムを渡すのscrollIntoViewメソッドを使用することができます。

​​

+0

を動作しなかったとして、私はあなたが正確にのようなあなたのScrollViewerの制御を命名していない限り、私もこれを試してみましたが、それはカスタムのものでは動作しませんScrollViewer.ScrollToHorizo​​ntalOffsetを使用して終了MSのリストボックステンプレートに名前がついています。バグレポートhttp://connect.microsoft.com/VisualStudio/feedback/ViewFeedback.aspx?FeedbackID=373113 –

関連する問題