ItemsControl, VirtualizingStackPanel et hauteur ScrollViewer

Question

Je veux afficher une liste importante d'éléments à l'aide d'un ItemsControl.

La raison pour laquelle j'utilise un ItemsControl est que le DataTemplate est beaucoup plus complexe dans l'application je travaille. Le code fourni ne reflète que le problème de la taille que j'ai

Je voudrais:

• ItemsControl à virtualisé parce qu'il ya beaucoup d'éléments à afficher

• sa taille d'étendre à son conteneur parent automatiquement (la grille)

  <Grid>
      <ItemsControl x:Name="My" ItemsSource="{Binding Path=Names}">
          <ItemsControl.Template>
              <ControlTemplate>
                  <StackPanel>
                      <StackPanel>
                          <TextBlock Text="this is a title" FontSize="15" />
                          <TextBlock Text="This is a description" />
                      </StackPanel>
                      <ScrollViewer CanContentScroll="True" Height="400px">
                          <VirtualizingStackPanel IsItemsHost="True" />
                      </ScrollViewer>
                  </StackPanel>
              </ControlTemplate>
          </ItemsControl.Template>
          <ItemsControl.ItemTemplate>
              <DataTemplate>
                  <TextBlock Text="{Binding}" />
              </DataTemplate>
          </ItemsControl.ItemTemplate>
      </ItemsControl>
  </Grid>
  

Le code se cache derrière:

public partial class Page1: Page
{
    public List<string> Names { get; set; }
    public Page1()
    {
        InitializeComponent();

        Names = new List<string>();
        for(int i = 0; i < 10000; i++)
            Names.Add("Name : " + i);

        My.DataContext = this;
    }
}

Comme je force la hauteur ScrollViewer à 400px, fonctionne la virtualisation ItemsControl que je pense. Le ItemsControl affiche la liste très rapidement, quel que soit le nombre d'éléments qu'il contient

Cependant, si je retire height = « 400px », la liste étendra sa hauteur pour afficher toute la liste, quelle que soit sa hauteur de conteneur parent. Pire encore:. Il semble derrière son contenant

Mettre un ScrollViewer autour du ItemsControl donne le résultat visuel attendu, mais la virtualisation disparaît et la liste prend trop de temps à afficher.

Comment puis-je obtenir à la fois l'expansion automatique de la hauteur et de la virtualisation de mon ItemsControl?

Answer 1

Le problème est dans le ItemsControl.Template: vous utilisez StackPanel là, ce qui donne à ses enfants autant la hauteur qu'ils veulent. Remplacez-le à quelque chose comme

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <StackPanel>
        <TextBlock Text="this is a title" FontSize="15" />
        <TextBlock Text="This is a description" />
    </StackPanel>
    <ScrollViewer CanContentScroll="True" Grid.Row="1">
        <VirtualizingStackPanel />
    </ScrollViewer>
</Grid>

Et il devrait fonctionner correctement.

it helps.