Question

我有一个ListView，如果用户单击某个项目，整个ListView将向左滑动并重新加载Listivew。问题是，如果我在按钮单击事件处理程序中同时执行这两项任务，则在方法完成之前不会呈现过渡。因此，由于我之后立即重新加载了ItemSource，因此ListView过渡甚至都不会进行动画处理。我需要一些可以等待ListView过渡，然后重新加载listview或强制ListView激活其过渡的东西。

XAML：

       <ListView
            x:Name="DocumentListView"
            IsItemClickEnabled="True"
            ItemClick="FileClicked"
            ItemsSource="{x:Bind Files, Mode=OneWay}"
            Loading="DocumentListView_Loading">
            <ListView.Transitions>
                <TransitionCollection>
                    <RepositionThemeTransition />
                </TransitionCollection>
            </ListView.Transitions>
            <ListView.ItemTemplate>
                <DataTemplate x:DataType="local:DocumentItem">
                    <local:DocumentsListRow />
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

C＃：

private void FileClicked(object sender, ItemClickEventArgs e)
{
    DocumentListView.Margin = new Thickness(-500, 0, 500, 0);
    DocumentListViewHeader.Margin = new Thickness(-500, 0, 500, 0);
    parent = Utility.Utility.FindParent<Documents>(this);

    //this line resets the ItemSource of ListView, if I include this the transition won't work
    parent.reloadList(0);
}

Answer 1

有两种选择。

更改ListView的位置后，您可以添加一些时间延迟。请参见以下代码示例：

<Button Content="Remove Rectangle" Click="RemoveButton_Click"/>
<ItemsControl Grid.Row="1" x:Name="rectangleItems">
    <ItemsControl.Transitions>
        <TransitionCollection>
            <RepositionThemeTransition></RepositionThemeTransition>
        </TransitionCollection>
    </ItemsControl.Transitions>
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapGrid Height="400"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.Items>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
    </ItemsControl.Items>
</ItemsControl>

    private async void RemoveButton_Click(object sender, RoutedEventArgs e)
    {
        rectangleItems.Margin = new Thickness(100);
        await Task.Delay(1000);
        rectangleItems.Items.Clear();
        for (int i = 0; i < 9; i++)
        {
            rectangleItems.Items.Add(new Rectangle() { Fill = new SolidColorBrush(Colors.Yellow), Width = 100, Height = 100, Margin = new Thickness(10) });
        }
    }

您可以使用RepositionThemeAnimation代替RepositionThemeTransition。 RepositionThemeAnimation具有Completed事件。您可以在Completed事件处理程序中重新加载列表。

<Grid>
<Grid.Resources>
    <Storyboard x:Name="PositionStoryboard">
        <RepositionThemeAnimation Storyboard.TargetName="rectangleItems" Duration="0:0:1" FromHorizontalOffset="-400" Completed="RepositionThemeAnimation_Completed"/>
    </Storyboard>
</Grid.Resources>
<Button Content="Remove Rectangle" Click="RemoveButton_Click"/>
<ItemsControl Grid.Row="1" x:Name="rectangleItems">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapGrid Height="400"/>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.Items>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
        <Rectangle Fill="Red" Width="100" Height="100" Margin="10"/>
    </ItemsControl.Items>
</ItemsControl>
</Grid>

    private  void RemoveButton_Click(object sender, RoutedEventArgs e)
    {
        PositionStoryboard.Begin();
    }

    private void RepositionThemeAnimation_Completed(object sender, object e)
    {
        rectangleItems.Items.Clear();
        for (int i = 0; i < 9; i++)
        {
            rectangleItems.Items.Add(new Rectangle() { Fill = new SolidColorBrush(Colors.Yellow), Width = 100, Height = 100, Margin = new Thickness(10) });
        }
    }

如何检测RepositionThemeTransition是否完成或强制RepositionThemeTransition激活

1 个答案: