3

私は何時間もこれと戦ってきましたが、私の問題を解決する方法を見つけることができないようです.

私の問題は、画面全体を占める項目コントロールがあることです。水平方向にのみスクロールできる画像の水平方向のリストを表示します。それらは垂直方向に中央に配置され、最初は画面の約 33% を占めます。

画像が使用可能なスペースの 100% を占めるまで、ユーザーがこのリストを拡大できるようにしたいと考えています。私は正常に動作する Scrollviewer.ZoomEnabled="true" を設定することでこれを行いました。itemscontrols scrollviewer の垂直方向のコンテンツ配置を「中央」に設定すると、アプリは中央を中心にズームインおよびズームアウトします。

でも...

タッチを使用するデバイスまたはタッチを使用するシミュレーターで実行すると、タッチ入力を使用して垂直方向にスクロールしようとするまで、ズーム動作が期待どおりに機能します。

アイテムは、中央ではなく下に即座に「ジャンプ」します。それらを再び正しく配置する唯一の方法は、ズームアウトして再度ズームインすることです。

この動作は、修正できないように見えるため、非常にイライラします。どんな助けでも大歓迎です!

問題を再現するための最小限の解決策は次のとおりですhttps://skydrive.live.com/redir?resid=EE9DF7D217DF3EA6!1060&authkey=!AJVGrLoTrOz8Hyk

コードを再作成する場合は、次のコードに従います。

ITEMSCONTROL.XAML

<Style x:Key="ItemsControlStyle" TargetType="ItemsControl">
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <VirtualizingStackPanel Orientation="Horizontal" Margin="90,0" ManipulationMode="TranslateX"/>
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ItemsControl">
                <ScrollViewer ZoomMode="Enabled"
                              VerticalSnapPointsType="None"
                              MinZoomFactor="0.5"
                              VerticalScrollMode="Disabled"
                              VerticalScrollBarVisibility="Disabled"
                              HorizontalScrollMode="Enabled" 
                              HorizontalScrollBarVisibility="Visible"
                              VerticalContentAlignment="Center">
                    <ItemsPresenter VerticalAlignment="Center" IsHitTestVisible="False" ScrollViewer.VerticalScrollMode="Disabled" ScrollViewer.VerticalScrollBarVisibility="Disabled"/>
                </ScrollViewer>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

MAINPAGE.XAML (抜粋)

<ItemsControl Grid.Row="1" ItemsSource="{Binding Pages}" Style="{StaticResource ItemsControlStyle}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Border Padding="5" VerticalAlignment="Center"  Margin="10">
                    <Border.Background>
                        <ImageBrush ImageSource="../Images/Shadow.png"/>
                    </Border.Background>
                    <Grid>
                        <ProgressRing IsActive="True" VerticalAlignment="Center" HorizontalAlignment="Center" Height="50" Width="50" Foreground="White" Visibility="{Binding HasLoaded, Converter={StaticResource BooleanToVisibilityConverter}}"/>
                    <Image Opacity="0" Source="{Binding LocalUrl, Converter={StaticResource LocalImagePathConverter}}" Height="{Binding Height}" Width="{Binding Width}" ImageOpened="ImageLoaded" />
                    </Grid>
                </Border>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
4

1 に答える 1