如何在 UWP 中的 ListView 中插入 VisualState 触发器？

Question

我正在尝试将 VisualState 触发器添加到列表视图，但它没有被触发。这是最有效的方法吗，因为 ListView 中的项目数有时可能会超过 300。

当宽度变小时，触发器正在尝试重新定位网格。

我当前的代码：

<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>

在里面我有声明 ListView 的部分

<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

尝试将 DataTemplate 的内容包装到 UserControl 中。

所以

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

如何在 UWP 中的 ListView 中插入 VisualState 触发器？

How to insert a VisualState Trigger inside a ListView in UWP?

xaml

winrt-xaml

win-universal-app

windows-10