我已经为此奋斗了几个小时,似乎无法找到解决问题的方法。
我的问题是,我有一个占据整个屏幕的项目控件。它显示图像的水平列表,只能水平滚动。它们垂直居中,最初占据屏幕的 33% 左右。
我希望用户能够放大到这个列表,直到图像占用 100% 的可用空间。我通过设置 Scrollviewer.ZoomEnabled="true" 来做到这一点,效果很好。通过将 itemscontrols 滚动查看器的垂直内容对齐设置为“中心”,应用程序可以围绕中心放大和缩小。
然而...
当我在带有触摸的设备或使用触摸的模拟器上运行它时,缩放行为按预期工作,直到我使用触摸输入并尝试垂直滚动。
然后项目立即“跳”到底部而不是中心,并且再次正确定位它们的唯一方法是缩小并再次缩小。
这种行为非常令人沮丧,因为我似乎无法修复它。任何帮助将不胜感激!
这是重现问题的最小解决方案https://skydrive.live.com/redir?resid=EE9DF7D217DF3EA6!1060&authkey=!AJVGrLoTrOz8Hyk
如果你想重新创建它,代码如下:
项目控制.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>