【问题标题】:GridView/ListView Scroll Into View is not workingGridView/ListView 滚动到视图不起作用
【发布时间】:2017-12-26 00:47:34
【问题描述】:

在我的应用程序中,我在主页中使用了一个GridView 和一个ListView。上述列表位于Dictionary 中,我将它们作为ContentPresenter 的内容加载到主页中,并且该元素包含在ScrollViewer 中。

主页的 XAML:

<Pivot Grid.Row="1"
           SelectionChanged="Pivot_SelectionChanged"
           SelectedIndex="{Binding PivotIndex, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}">
        <PivotItem>
            <PivotItem.Header>
                <TextBlock Text="Home"/>
            </PivotItem.Header>
            <PivotItem.Content>
                <ScrollViewer ViewChanged="Scroll_ViewChanged">
                    <ContentPresenter ContentTemplate="{StaticResource SwitchableHomeView}"/>
                </ScrollViewer>
            </PivotItem.Content>
        </PivotItem>
        <PivotItem>
            <PivotItem.Header>
                <TextBlock Text="Fitness"/>
            </PivotItem.Header>
            <PivotItem.Content>
                <ScrollViewer ViewChanged="Scroll_ViewChanged">
                    <ContentPresenter ContentTemplate="{StaticResource SwitchableFitnessView}"/>
                </ScrollViewer>
            </PivotItem.Content>
        </PivotItem>
    </Pivot>

Dictionary 类的 XAML:

<DataTemplate x:Key="SwitchableHomeView"
              x:DataType="data:ItemHelper">
    <UserControl>
        <StackPanel>
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup>
                    <VisualState>
                        <VisualState.StateTriggers>
                            <AdaptiveTrigger MinWindowWidth="0"/>
                        </VisualState.StateTriggers>
                        <VisualState.Setters>
                            <Setter Target="HomeListView.Visibility"
                                    Value="Visible"/>
                            <Setter Target="HomeGridView.Visibility"
                                    Value="Collapsed"/>
                        </VisualState.Setters>
                    </VisualState>
                    <VisualState>
                        <VisualState.StateTriggers>
                            <AdaptiveTrigger MinWindowWidth="901"/>
                        </VisualState.StateTriggers>
                        <VisualState.Setters>
                            <Setter Target="HomeListView.Visibility"
                                    Value="Collapsed"/>
                            <Setter Target="HomeGridView.Visibility"
                                    Value="Visible"/>
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <ListView Name="HomeListView"
                      Style="{StaticResource ListViewCustomStyle}"
                      ItemsSource="{Binding HomeList, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
                      ItemClick="Article_ItemClick"
                      Loaded="ArticleCollection_Loaded"/>
            <GridView Name="HomeGridView"
                      Style="{StaticResource GridViewCustomStyle}"
                      ItemsSource="{Binding HomeList, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
                      ItemClick="Article_ItemClick"
                      Loaded="ArticleCollection_Loaded"/>
        </StackPanel>
    </UserControl>
</DataTemplate>

    <Style x:Key="GridViewCustomStyle"
       TargetType="GridView">
    <Setter Property="SelectionMode"
            Value="None"/>
    <Setter Property="ItemsPanel"
            Value="{StaticResource GridViewCenteredItemsPanel}"/>
    <Setter Property="IsItemClickEnabled"
            Value="True"/>
    <Setter Property="ShowsScrollingPlaceholders"
            Value="True"/>
    <Setter Property="ItemContainerStyle"
            Value="{StaticResource CustomGridViewItemStyle}"/>
    <Setter Property="ItemTemplate"
            Value="{StaticResource CustomGridItemTemplate}"/>
    <Setter Property="ItemContainerTransitions"
            Value="{StaticResource GridViewItemCustomTransitions}"/>
</Style>

<Style x:Key="ListViewCustomStyle"
       TargetType="ListView">
    <Setter Property="SelectionMode"
            Value="None"/>
    <Setter Property="IsItemClickEnabled"
            Value="True"/>
    <Setter Property="ShowsScrollingPlaceholders"
            Value="True"/>
    <Setter Property="ItemContainerStyle"
            Value="{StaticResource StretchedListView}"/>
    <Setter Property="ItemTemplate"
            Value="{StaticResource CustomListItemTemplate}"/>
    <Setter Property="ItemContainerTransitions"
            Value="{StaticResource GridViewItemCustomTransitions}"/>
</Style>

字典类的代码隐藏:

private async void ArticleCollection_Loaded(object sender, RoutedEventArgs e)
    {
        if (navigatedUri != null)
        {
            if (sender is GridView)
            {
                var gv = sender as GridView;

                var item = (gv.ItemsSource as ObservableCollection<ItemHelper>)
                        .Where(compare => compare.ItemImage?.UriSource?.OriginalString == navigatedUri).FirstOrDefault();
                await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, async() => 
                {
                    gv.UpdateLayout();
                    await Task.Delay(500);
                    gv.ScrollIntoView(item);
                    //gv.UpdateLayout();
                });

                var animation = ConnectedAnimationService.GetForCurrentView().GetAnimation(StaticProperties.SquareAnimationKey);
                if (animation != null)
                {
                    if (gv.ContainerFromItem(item) is GridViewItem container)
                    {
                        var root = (FrameworkElement)container.ContentTemplateRoot;
                        var image = (Image)root.FindName("Image");
                        animation.TryStart(image);
                    }
                    else
                    {
                        animation.Cancel();
                    }
                }
                if (gv.Visibility == Visibility.Visible)
                {
                    navigatedUri = null;
                }
            }
            else if (sender is ListView)
            {
                var gv = sender as ListView;
                var animation = ConnectedAnimationService.GetForCurrentView().GetAnimation(StaticProperties.SquareAnimationKey);
                if (animation != null)
                {
                    var item = (gv.ItemsSource as ObservableCollection<ItemHelper>)
                        .Where(compare => compare.ItemImage?.UriSource?.OriginalString == navigatedUri).First();
                    await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, async() =>
                    {
                        gv.UpdateLayout();
                        await Task.Delay(500);
                        gv.ScrollIntoView(item);
                        //gv.UpdateLayout();
                    });

                    if (gv.ContainerFromItem(item) is GridViewItem container)
                    {
                        var root = (FrameworkElement)container.ContentTemplateRoot;
                        var image = (Image)root.FindName("image");
                        // Wait for image opened. In future Insider Preview releases, this won't be necessary.
                        image.Opacity = 0;
                        animation.TryStart(image);
                    }
                    else
                    {
                        animation.Cancel();
                    }
                }
                if (gv.Visibility == Visibility.Visible)
                {
                    navigatedUri = null;
                }
            }
        }
    }

我根据屏幕大小切换ListViewGridView。因此,当我在查看项目后导航回MainPage 时,ListViewGridView 都被加载,Loaded 事件被触发。然后我将ListViewGridView 滚动到该项目,但它始终显示第一项。我尝试了谷歌的各种解决方案,但没有一个对我有用。

所以我想问一下我是否使用了正确的方法来使其工作。或者有什么更好的方法可以完成这项工作。谢谢

【问题讨论】:

    标签: c# xaml listview gridview uwp


    【解决方案1】:

    从您的 PivotItem ContentTemplates 中删除 ScrollViewers,它可能会起作用。 GridView 有它自己的内部 ScrollViewer,这是 ScrollIntoView 将尝试使用的。但是,由于您已将 GridView 放置在滚动查看器中,因此不使用内部滚动查看器,因为 GridView 具有由父 ScrollViewer 授予的有效无限大小

    【讨论】:

    • 是的,我稍微调整了我的 Templates 以使其工作,但必须删除父 ScrollViewer
    猜你喜欢
    • 1970-01-01
    • 2017-07-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多