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

我一直在爲此奮鬥了好幾個小時，而且似乎找不到解決我的問題的方法。WinRT ItemsControl具有縮放，水平滾動和居中內容

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

我希望用戶能夠放大到該列表，直到圖像佔用100％的可用空間。我已經通過設置Scrollviewer.ZoomEnabled =「true」來完成這項工作。通過將itemscontrol 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>

來源

2012-10-30 Adam Niles-Crane Walker

你可以添加一些截圖嗎？我無法回答這個問題，或者我根本無法理解你。 – JuanK

我第一次在模擬器中運行應用程序時，能夠重現您的問題。在我退出應用程序並再次運行之後，我無法再次發生這種情況。看起來像ScrollViewer錯誤地將內容固定在頂部，而不是像你想要的那樣固定在中間。確實很奇怪。我希望我能爲你解答。 –

好了，所以我測試：

在觸摸顯示器（本地機器） - 工作得很好
在觸摸顯示器（模擬器） - 工作得很好
上的表面RT（遠程機器） - 工作正常
在普通顯示器（模擬） - 工作正常

你試過觸摸你的耳朵，而你做了嗎？ :)

我不認爲這是一個普遍的問題，因爲我不能複製它。

來源

2013-06-08 06:47:20

提供一個樣本程序是很方便的。 –

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

回答

相關問題