0

テクスチャを背景としてスクロールビューアに追加しようとしています。コンテンツに合わせて背景を動かしたいのですが、固定したいです。視差効果を使わない...

これまでのところ、私が持っているものは次のとおりです。

   <!-- 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) でわかるように、Horizo​​ntalOffset を 2 倍にして、背景をコンテンツで固定する必要がありました。しかし、スクローラーのコンテンツを移動しているとき、背景はコンテンツの位置に固定されておらず、少し異なって動き、少し遅くなり、アニメーションを正しい位置で終了します。

それを取得する方法、またはデフォルトでウィンドウが視差背景を使用するように「強制」されているかどうかについての提案はありますか?

ありがとう、

4

1 に答える 1

1

Tiled Brush は 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>
  • Grid "TiledBackground" には、Scrollviewer を埋めるために必要なタイルと同じ数のセルが含まれています。これはコード ビハインドで実装されます。

より良い解決策がすぐに利用可能になることを願っています。

于 2012-08-01T23:54:26.770 に答える