목록 상자 기울기 효과 조작

Question

나는, 랩 패널에 목록 상자를했습니다. 이미지 갤러리 뷰어에서 필요한 것. 코드 :

   <ListBox.ItemTemplate> 
        <DataTemplate> 
         <StackPanel Orientation="Horizontal"> 
          <StackPanel.Children> 
           <Grid Margin="5"> 
            <Rectangle Fill="{StaticResource PhoneSubtleBrush}" Visibility="{Binding listboxItemContainer[0].backgroundVisibility, FallbackValue=Collapsed}" /> 
            <Image Name="image1" Width="90" Height="90" Source="{Binding listboxItemContainer[0].ThumbnailPath}" DataContext="{Binding}" Tap="image_Tap" Stretch="Fill"/> 
           </Grid> 
           <Grid Margin="5"> 
            <Rectangle Fill="{StaticResource PhoneSubtleBrush}" Visibility="{Binding listboxItemContainer[1].backgroundVisibility, FallbackValue=Collapsed}"/> 
            <Image Name="image2" Width="90" Height="90" Source="{Binding listboxItemContainer[1].ThumbnailPath}" DataContext="{Binding}" Tap="image_Tap" Stretch="Fill"/> 
           </Grid> 
           <Grid Margin="5"> 
            <Rectangle Fill="{StaticResource PhoneSubtleBrush}" Visibility="{Binding listboxItemContainer[2].backgroundVisibility, FallbackValue=Collapsed}"/> 
            <Image Name="image3" Width="90" Height="90" Source="{Binding listboxItemContainer[2].ThumbnailPath}" DataContext="{Binding}" Tap="image_Tap" Stretch="Fill"/> 
           </Grid> 
           <Grid Margin="5"> 
            <Rectangle Fill="{StaticResource PhoneSubtleBrush}" Visibility="{Binding listboxItemContainer[3].backgroundVisibility, FallbackValue=Collapsed}"/> 
            <Image Name="image4" Width="90" Height="90" Source="{Binding listboxItemContainer[3].ThumbnailPath}" DataContext="{Binding}" Tap="image_Tap" Stretch="Fill"/> 
           </Grid> 
          </StackPanel.Children> 
         </StackPanel> 
        </DataTemplate> 
       </ListBox.ItemTemplate> 

문제는 내가 이미지를 탭했을 때 이미지가 4 개 항목을 의미 전체 목록 상자 항목을 기울어 있다는 것입니다.

은 여기에서 제안을 시도 : http://forums.create.msdn.com/forums/t/73716.aspx

다른 제안을 (혼란스러워하지 않습니다 나는이 솔루션과 함께 hubtile 메뉴를 만들고 싶지 않아)?

Answer 1

Silverlight Toolkit의 기울기 코드를 사용하고있는 것 같습니까? 유형에 따라 요소에 기울기를 추가하기 때문에이 작업에 열중하지 않습니다. 즉, 효과를 적용 할시기를 정교하게 제어 할 수 없습니다. 단지 4 그리드의 각각에 적용되는 귀하의 경우에는

local:MetroInMotion.Tilt="6" 

:

http://www.scottlogic.co.uk/blog/colin/2011/05/metro-in-motion-part-4-tilt-effect/

당신은과 같이 개별 UI 요소에 기울기를 적용 할 수 있습니다

나는 여기에 대안 틸트 동작을 썼다 :

  <ListBox.ItemTemplate> 
       <DataTemplate> 
        <StackPanel Orientation="Horizontal"> 
         <StackPanel.Children> 
          <Grid Margin="5" local:MetroInMotion.Tilt="6"> 
           <Rectangle Fill="{StaticResource PhoneSubtleBrush}" Visibility="{Binding listboxItemContainer[0].backgroundVisibility, FallbackValue=Collapsed}" /> 
           <Image Name="image1" Width="90" Height="90" Source="{Binding listboxItemContainer[0].ThumbnailPath}" DataContext="{Binding}" Tap="image_Tap" Stretch="Fill"/> 
          </Grid> 
          <Grid Margin="5" local:MetroInMotion.Tilt="6"> 
           <Rectangle Fill="{StaticResource PhoneSubtleBrush}" Visibility="{Binding listboxItemContainer[1].backgroundVisibility, FallbackValue=Collapsed}"/> 
           <Image Name="image2" Width="90" Height="90" Source="{Binding listboxItemContainer[1].ThumbnailPath}" DataContext="{Binding}" Tap="image_Tap" Stretch="Fill"/> 
          </Grid> 
          <Grid Margin="5" local:MetroInMotion.Tilt="6"> 
           <Rectangle Fill="{StaticResource PhoneSubtleBrush}" Visibility="{Binding listboxItemContainer[2].backgroundVisibility, FallbackValue=Collapsed}"/> 
           <Image Name="image3" Width="90" Height="90" Source="{Binding listboxItemContainer[2].ThumbnailPath}" DataContext="{Binding}" Tap="image_Tap" Stretch="Fill"/> 
          </Grid> 
          <Grid Margin="5" local:MetroInMotion.Tilt="6"> 
           <Rectangle Fill="{StaticResource PhoneSubtleBrush}" Visibility="{Binding listboxItemContainer[3].backgroundVisibility, FallbackValue=Collapsed}"/> 
           <Image Name="image4" Width="90" Height="90" Source="{Binding listboxItemContainer[3].ThumbnailPath}" DataContext="{Binding}" Tap="image_Tap" Stretch="Fill"/> 
          </Grid> 
         </StackPanel.Children> 
        </StackPanel> 
       </DataTemplate> 
      </ListBox.ItemTemplate>