1

我想实现这样的动画:

演示

所以我决定用FlipView作为主容器,用两行网格作为数据模板。Grid 将处理ManipulationDelta事件以降低文本第一部分的高度,以便第二部分变得可见。当文本高度达到最小值时,我们必须将事件路由到父 ScrollViewer,以便它可以翻转到下一个项目。

private void OnManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
    {
        if (CanDecreaseLine(e))
        {
            //Decrease first line height...
            e.Handled = true;
        }
    }

但是我遇到的问题是,当我尝试在子(网格)端处理 ManipulationDelta 时,FlipView 停止工作。不管我们是否设置了 Handled 属性

这是简化的xaml:

<FlipView>
        <FlipView.ItemTemplate>
            <DataTemplate>
                <Grid Background="Transparent" 
                  ManipulationMode="TranslateY, TranslateInertia"
                  ManipulationDelta="OnManipulationDelta">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <TextBlock Grid.Row="0" Text="FirstLine"/>
                    <TextBlock Grid.Row="1" Text="SecondLine"/>
                </Grid>
            </DataTemplate>
        </FlipView.ItemTemplate>
    </FlipView>

由于ManipulationMode="TranslateY, TranslateInertia" , ScrollViewer 停止工作,但没有它 Grid 将不会接收我需要更改 Grid 行的大小以实现动画的操作事件。

是否可以在 ScrollViewer 的子级上处理操作事件,或者是否有其他方法可以实现此动画?

4

1 回答 1

2

ManipulationDelta您可以尝试在 FlipView 更改时订阅该事件SelectedItem。然后根据需要在内部处理它Grid。然后,当您检测到用户进一步滚动并且您应该停止处理 中的事件时Grid,取消订阅该事件并让 FlipView 正常处理它。

没有测试过,所以不确定它是否会工作。

此外,您可能需要对可视化树进行一些挖掘以获取Grid子事件的权限。或者UserControlDataTemplate其中使用一个可以切换事件订阅的属性(可以绑定到)ManipulationDelta

于 2015-11-29T16:35:58.467 回答