Windows Phone 8.1中的ListView在滚动浏览长列表时抖动(XAML)

Question

我在Windows Phone 8.1应用程序中滚动浏览ListViews时遇到问题.短列表滚动得很好,滚动顺畅但是很快虚拟化就会在整个ListView"摆动"中向左轻微踢,但是明显足以令人讨厌.

我已经尝试删除所有过渡到没有效果,以及项目加载增加到没有成功.将项目面板设置为StackPanel(删除虚拟化)可以解决问题,但不是更可取.

我的列表视图绑定到BasicView模板附带的DefaultViewModel中的属性.

我做错了什么以及导致我的ListViews出现这种行为的原因是什么？

XAML:

<ListView x:Name="searchResultsList" IsItemClickEnabled="True" ItemClick="ListView_ItemClick" ItemsSource="{Binding searchResults}">
   <ListView.ItemContainerStyle>
      <Style TargetType="ListViewItem">
          <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
          <Setter Property="Margin" Value="0,0,0,20" />
      </Style>
   </ListView.ItemContainerStyle>
   <ListView.ItemTemplate>
      <DataTemplate>
          <Grid>
             <Grid.ColumnDefinitions>
                <ColumnDefinition Width="80" />
                <ColumnDefinition Width="10" />
                <ColumnDefinition Width="*" />
             </Grid.ColumnDefinitions>

             <Border Width="80" Height="80">
                <Image Source="{Binding Image}" />
             </Border>

             <StackPanel Grid.Column="2">
                <TextBlock Text="{Binding PodcastTitle}" TextWrapping="WrapWholeWords" FontSize="{StaticResource TextStyleExtraLargeFontSize}" />
                <TextBlock Text="{Binding LastUpdated, Converter={StaticResource dateConverter}}" Style="{ThemeResource ListViewItemSubheaderTextBlockStyle}" />
                <TextBlock Text="{Binding PodcastArtist}" TextWrapping="WrapWholeWords" Style="{ThemeResource ListViewItemContentTextBlockStyle}" />
             </StackPanel>
           </Grid>
       </DataTemplate>
   </ListView.ItemTemplate>
 </ListView>

Answer 1

所以这似乎是一个操作系统问题,正如MS论坛上的这个帖子所证明的那样:http://social.msdn.microsoft.com/Forums/en-US/9a363d33-5760-4d38-9c81-84259c4edcbe/listview-jiggles -horizo​​ntally-when-large-item-about-to-to-or-out-in-windows-phone-81-preview？forum = WindowsPhonePreviewSDK&prof = required.

问题确实存在于虚拟化中,物品没有固定的宽度.使用star作为宽度或进行水平对齐拉伸将不起作用,因此考虑方向和分辨率的唯一解决方案是将宽度绑定到ListView的容器的ActualWidth属性:

<Grid x:name="contentRoot" Margin="19,9.5,19,0">
<ListView>
 <ListView.ItemTemplate>
   <DataTemplate>
     <Grid Width={Binding ActualWidth, ElementName=contentRoot} />

   </DataTemplate>

 </ListView.ItemTemplate>
</ListView>
</Grid>

Answer 2

列表视图中的第一个元素未显示,因为在加载页面时,网格的ActiualWidth在第一秒为0.这是解决方案,这对我有用:

<Grid x:Name="contentRoot" Margin="20">
<ListView>
 <ListView.ItemTemplate>
   <DataTemplate>
     <Grid MinWidth="{Binding ActualWidth, ElementName=contentRoot}" />
   </DataTemplate>
 </ListView.ItemTemplate>
</ListView>
</Grid>