WinRT ItemsControl具有縮放，水平滾動和居中內容

Question

我現在已經和我斗爭了幾個小時，似乎無法找到解決問題的方法。

我的問題是，我有一個項目控件占據了整個屏幕。 它顯示水平的圖像列表，只能水平滾動。 它們垂直居中，最初占據屏幕的33％左右。

我希望用戶能夠放大到此列表，直到圖像占用100％的可用空間。 我通過設置Scrollviewer.ZoomEnabled =“true”來完成這項工作。 通過將itemscontrols scrollviewer的垂直內容對齊設置為“Center”，應用程序可以在中心周圍放大和縮小。

然而...

當我在帶觸摸的設備或使用觸摸的模擬器上運行它時，縮放行為按預期工作直到我使用觸摸輸入並嘗試垂直滾動。

然后物品立即“跳”到底部而不是中心，再次正確定位它們的唯一方法是縮小並再次縮小。

這種行為非常令人沮喪，因為我似乎無法修復它。 任何幫助都將受到大力贊賞！

這是重新解決問題的最小解決方案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>

Answer 1

好的，所以我測試了：

1. 在觸摸顯示器（本地機器） - 工作正常
2. 在觸摸顯示器（模擬器） - 工作正常
3. 在Surface RT（遠程機器）上 - 工作正常
4. 在普通的監視器（模擬器） - 工作正常

你有沒有試過觸摸你的耳朵？ :)

我不認為這是一個普遍的問題，因為我無法復制它。