web-dev-qa-db-ja.com

Windows Phone 8.1のListView長いリストをスクロールしているときにぐらつく（XAML）

Windows Phone8.1アプリでListViewをスクロールする際に問題が発生します。短いリストは問題なくスクロールし、スムーズにスクロールしますが、仮想化がListView全体をわずかに左に「ぐらつく」とすぐに開始しますが、煩わしいほど目立ちます。

すべてのトランジションを削除して効果がないようにし、アイテムを段階的にロードして成功しないようにしました。アイテムパネルをStackPanelに設定（仮想化を削除）すると問題は修正されますが、お勧めできません。

私のリストビューは、基本ページテンプレートに付属するDefaultViewModelのプロパティにバインドされています。

何が間違っているのでしょうか。また、ListViewでこの動作が発生する原因は何ですか。

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>
c#xamlwindows-runtimewindows-phone-8.1
24
CoreyRalli

したがって、MSフォーラムのこのスレッドで証明されているように、これはOSの問題のようです。 http://social.msdn.Microsoft.com/Forums/en-US/9a363d33-5760-4d38-9c81-84259c4edcbe/listview-jiggles-horizo​​ntally-when-large-item-about-to-scroll-in-or-out-in-windows-phone-81-preview？forum = WindowsPhonePreviewSDK＆prof = required 。

問題は確かに仮想化にあり、固定幅のないアイテムがあります。幅として星を使用したり、水平方向の配置を拡大したりしても機能しないため、方向と解像度を考慮した唯一の解決策は、幅を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>
23
CoreyRalli

ページをロードしたとき、グリッドのActiualWidthが最初の1秒間に0であるため、リストビューの最初の要素は表示されません。これは私のために働いている解決策です：

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

これは本当に厄介なバグです。なぜこれが何年も前から修正されていないのか理解できません。

垂直スクロールリストビューでアイテムをストレッチするImhoは非常に基本的な機能であり、100％機能するはずです。

考えられる回避策もこれを切り取ったものであり、サイズの変更にも注意する必要があります。

public class StrechItemsListView : ListView
{
    public StrechItemsListView()
    {
        SizeChanged += StrechItemsListView_SizeChanged;
    }

    private void StrechItemsListView_SizeChanged(object sender, SizeChangedEventArgs e)
    {
        if (ItemsPanelRoot != null)
        {
            ItemsPanelRoot.Width = e.NewSize.Width;
        }
    }
}

Xamlをカスタムリストビュータイプのみに変更することは、すべてのデータテンプレートなどを編集するよりも手間がかからず、クリーンです。ちょうど私の2セントです。

3
Andre Classen

私の練習はうまくいくようです。少なくともWP8.1では。

<ListView></ListView>ブロックにItemsPanelTemplateを明示的に設定するだけですが、使用しないでください

Style="{StaticResource ListViewStyle1}"または他の何か。

サンプルコード：

<ListView ItemsSource="{Binding RadioList}" ScrollViewer.HorizontalScrollBarVisibility="Hidden" ScrollViewer.HorizontalScrollMode="Disabled"
            ScrollViewer.VerticalScrollBarVisibility="Hidden" ScrollViewer.VerticalScrollMode="Auto">
        <ListView.ItemTemplate>
            <DataTemplate>
                <Grid Margin="10,3,10,0">
                    <TextBlock Text="{Binding RadioName}" FontSize="15" VerticalAlignment="Center" HorizontalAlignment="Center"/>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
        <ListView.ItemContainerStyle>
            <Style TargetType="ListViewItem">
                <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            </Style>
        </ListView.ItemContainerStyle>
        <ListView.ItemsPanel>
            <ItemsPanelTemplate>
                <VirtualizingStackPanel Orientation="Vertical" Width="{Binding PhoneWidth}"/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>
    </ListView>

HorizontalContentAlignment設定のWidthとVirtualizingStackPanelは、コンテンツをListViewの中央に配置するために使用されます。これらの設定は自由に移動できます。理由はわかりません。 、しかしそれは機能します。

2
Silenco Tang

これは、Windows8.1アプリ用のWindows10で修正されました

0
Alberto Rivelli