Wie Einfügen eines VisualState-Auslösers in einem ListView in UWP?

Question

Ich versuche, einen VisualState-Trigger zu einem Listview hinzuzufügen, aber es wird nicht ausgelöst. Dies ist der effizienteste Weg, da die Anzahl der Elemente in der ListView zeitweise größer als 300 sein kann.

Der Trigger versucht, die Gitter neu zu positionieren, wenn die Breite kleiner wird.

Mein aktueller Code:

<Page.Resources> 
    <DataTemplate x:Key="mainDataTemplate"> 
     <Grid Padding="15" BorderBrush="Aqua" BorderThickness="1" Margin="6"> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="Auto" /> 
       <RowDefinition Height="*"/> 
      </Grid.RowDefinitions> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="Auto"/> 
       <ColumnDefinition Width="Auto"/> 
       <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 

      <VisualStateManager.VisualStateGroups> 
       <VisualStateGroup> 
        <VisualState x:Name="mobileView"> 
         <VisualState.Setters> 
          <Setter Target="TitleDescGrid.(Grid.Row)" Value="1" /> 
          <Setter Target="TitleDescGrid.(Grid.Column)" Value="0" /> 
          <Setter Target="TitleDescGrid.(Grid.ColumnSpan)" Value="2" /> 
          <Setter Target="PosterGrid.Background" Value="Pink" /> 
         </VisualState.Setters> 
         <VisualState.StateTriggers> 
          <AdaptiveTrigger MinWindowWidth="500" /> 
         </VisualState.StateTriggers> 
        </VisualState> 
       </VisualStateGroup> 
      </VisualStateManager.VisualStateGroups> 

      <Grid x:Name="PosterGrid" Grid.Column="0" Grid.Row="0" Margin="3,10,3,3" 
            Height="400" Width="180" DataContext="{Binding}" Background="SaddleBrown" 
            SizeChanged="PosterGrid_SizeChanged"> 
       <TextBlock Text="{Binding}" /> 
      </Grid> 
      <Grid x:Name="TitleDescGrid" Grid.Row="0" Grid.Column="1" 
            SizeChanged="TitleDescGrid_SizeChanged" 
            Background="DarkCyan" DataContext="{Binding}" 
            Width="420" Margin="5,14,5,5" > 
       <TextBlock Text="{Binding}" /> 
      </Grid> 
      <Grid x:Name="RatingsGrid" Grid.Row="0" 
            DataContext="{Binding}" 
            Grid.Column="2" 
            Background="Olive" 
            Width="200" Margin="5,15,0,0" > 
       <TextBlock Text="{Binding}" /> 
      </Grid> 
     </Grid> 
    </DataTemplate> 
</Page.Resources> 

Und im Inneren habe ich die Rolle bekam, wo die Listview deklariert

<StackPanel x:Name="ParentSP"> 
    <ListView x:Name="movieListview" Margin="8,0,8,8" 
       Grid.Row="0" 
       ItemTemplate="{StaticResource mainDataTemplate}" 
       SizeChanged="movieListview_SizeChanged"> 
     <ListView.ItemContainerStyle> 
      <Style TargetType="ListViewItem"> 
       <Setter Property="HorizontalContentAlignment" Value="Center"/> 
       <Setter Property="VerticalContentAlignment" Value="Center"/> 
      </Style> 
     </ListView.ItemContainerStyle> 
    </ListView> 
</StackPanel> 

Answer 1

Versuchen Sie den Inhalt des Datatemplate in einem Usercontrol Verpackung.

So

<Page.Resources> 
    <DataTemplate x:Key="mainDataTemplate"> 
     <UserControl> 
      <Grid Padding="15" BorderBrush="Aqua" BorderThickness="1" Margin="6">