Исправлен фон в scrollviewer Windows Metro (не параллаксирование)

Question

Я пытаюсь добавить текстуру в качестве фона для scrollviewer. Я хочу, чтобы фон перемещался с контентом, но я хочу его fiexd. Не используется эффект параллакса ...

Пока что у меня есть это: за

<!-- Background --> 
    <Canvas ZIndex="-1" x:Name="backgroundCanvas"> 
    </Canvas> 

     <ScrollViewer 
      x:Name="myGridScrollViewer" 
      AutomationProperties.AutomationId="GridScrollViewer" 
      Grid.Row="1" 
      Margin="0,-4,0,0" 
      Style="{StaticResource HorizontalScrollViewerStyle}"> 
      <StackPanel Orientation="Horizontal"> 
       <StackPanel Margin="116,4,0,0" Orientation="Horizontal" Height="586" VerticalAlignment="Top"> 
        <Border x:Name="HeroImage" VerticalAlignment="Top" Width="700" Height="550" Background="Yellow" Margin="0,0,15,0" ></Border> 
        <Border VerticalAlignment="Top" Width="350" Height="400" Background="White" Margin="0" ></Border> 
       </StackPanel> 
       <GridView 
        x:Name="recipeGridView" 
        AutomationProperties.AutomationId="MyGridView" 
        AutomationProperties.Name="MyItems" 
        TabIndex="1" 
        Grid.Row="1" 
        Margin="65,0,116,46" 
        ItemsSource="{Binding Path=Items}" 
        ItemTemplate="{StaticResource myGridViewTemplate}" 
        VirtualizingStackPanel.VirtualizationMode="Recycling" 
        SelectionMode="None" 
        IsItemClickEnabled="True" 
        ItemClick="ItemDetailClick" VerticalContentAlignment="Top"/> 
      </StackPanel> 
     </ScrollViewer> 

Код:

public ItemsList() 
{ 
    this.InitializeComponent(); 

    UpdateBackground(0); 
    myGridScrollViewer.ViewChanged += UpdateBackgroundImagePosition; 
} 

private void UpdateBackground(double offset) 
{ 
    BitmapImage im = new BitmapImage(new Uri("ms-appx:///Assets/tileable_bg.png")); 
    var brush = new ImageBrush(); 
    brush.ImageSource = im; 

    backgroundCanvas.SetValue(Canvas.WidthProperty, Window.Current.Bounds.Width); 
    backgroundCanvas.SetValue(Canvas.HeightProperty, Window.Current.Bounds.Height); 
    backgroundCanvas.SetValue(Canvas.MarginProperty, new Thickness(offset, 0, 0, 0)); 
    backgroundCanvas.SetValue(Canvas.BackgroundProperty, brush); 
} 

private void UpdateBackgroundImagePosition(object sender, ScrollViewerViewChangedEventArgs e) 
{ 
    UpdateBackground(-((ScrollViewer)sender).HorizontalOffset*2); 
} 

Как вы можете видеть в слушателя событий (UpdateBackgroundImagePosition), Мне пришлось умножить HorizontalOffset на 2, чтобы получить фон с содержанием. Но когда я перемещаю содержимое скроллера, фон не фиксируется в позиции содержимого, он немного отличается, немного медленнее, а затем заканчивает анимацию в правильном положении.

Любое предложение о том, как получить это или если по умолчанию окна «вынуждают» использовать фон параллакса?

Спасибо,

Answer 1

Как Плиточные кисточкой пока не поддерживаются в Windows 8 Metro, решение, что, кажется, работает, хотя и не очень приятно это:

 <ScrollViewer 
     x:Name="itemsGridScrollViewer" 
     AutomationProperties.AutomationId="GridScrollViewer" 
     Grid.Row="0" 
     Margin="0,-4,0,0" 
     Style="{StaticResource HorizontalScrollViewerStyle}"> 

     <!-- Main Grid: Wrapper for all the content --> 
     <Grid x:Name="MainGrid"> 
      <Grid x:Name="TiledBackground" /> 

      <GridView x:Name="ContentPanel" .... /> 
     </Grid> 
    </Scrollviewer> 

• Сетка «TiledBackground» содержит столько ячеек, сколько необходимо для заполнения Scrollviewer. Это реализовано в коде.

Я надеюсь, что в ближайшее время появится лучшее решение.