Question

我创建了一个弹出控件，可以接受FrameworkElement类型的任何视图。此外，您还可以提供视图模型，该模型将绑定到所提供的子视图的DataContext。一切正常，但渲染数据需要几秒钟。视图模型的ObservableCollection包含大约300个项目。所以说实话，300件物品不应该引起任何问题。

没有任何延迟，如果我将弹出窗口中的xaml提取到常规页面。

那么，Popup控件中是否有某些内容在设置Child内容属性时发生，这会导致这样的延迟？因为现在这让我大吃一惊。

提前致谢！

[更新] 根据要求，形成工具窗口的子内容的XAML：

<UserControl
    x:Class="App.Controls.ContactSelector"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App.Controls"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:interactivity="using:Microsoft.Xaml.Interactivity"
    xmlns:core="using:Microsoft.Xaml.Interactions.Core"
    mc:Ignorable="d" x:Name="contactSelector"
    DataContext="{Binding ContactSelectorViewModel,Source={StaticResource Locator}}">

    <Grid HorizontalAlignment="Stretch" Style="{StaticResource BaseGridStyle}">
        <Grid.RowDefinitions>
            <RowDefinition Height="1*" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <ListView Grid.Row="0" ItemsSource="{Binding ContactCollection}">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid Margin="12">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="1*" />
                        </Grid.ColumnDefinitions>
                        <!--<Image Margin="0,0,10,0" Grid.Row="0" Grid.Column="0"
                               Source="{Binding Thumbnail}" MaxHeight="35"
                               Visibility="{Binding Thumbnail, Converter={StaticResource ObjectNullToVisibilityConverter}}" />-->
                        <!--<Image Margin="0,5,5,5" Grid.Row="0" Grid.Column="0" MaxHeight="35"
                               Source="ms-appx:///Assets/Images/Contact.png"
                               Visibility="{Binding Thumbnail, Converter={StaticResource InverseObjectNullToVisibilityConverter}}" />-->

                        <TextBlock Grid.Row="0" Grid.Column="1" Text="{Binding FullName}"
                                   VerticalAlignment="Center"
                                   Style="{StaticResource TextBlockMedium}" />

                        <!--<Grid Grid.Row="1" Grid.Column="1">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                            </Grid.RowDefinitions>
                            <ItemsControl Grid.Row="0" ItemsSource="{Binding MobileNumbers}">
                                <ItemsControl.ItemTemplate>
                                    <DataTemplate>
                                        <Grid Margin="10,5">
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="1*" />
                                            </Grid.ColumnDefinitions>
                                            <TextBlock Grid.Column="0" Margin="0"
                                                       Text="{Binding Number}"
                                                       HorizontalAlignment="Stretch"
                                                       Style="{StaticResource TextBlockMedium}">
                                                <interactivity:Interaction.Behaviors>
                                                    <core:EventTriggerBehavior EventName="Tapped">
                                                        <core:InvokeCommandAction
                                                            Command="{Binding DataContext.SelectContact, ElementName=contactSelector}"
                                                            CommandParameter="{Binding}" />
                                                    </core:EventTriggerBehavior>
                                                </interactivity:Interaction.Behaviors>
                                            </TextBlock>
                                        </Grid>
                                    </DataTemplate>
                                </ItemsControl.ItemTemplate>
                            </ItemsControl>
                        </Grid>-->
                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
            <!--<ListView.GroupStyle>
                <GroupStyle>
                    <GroupStyle.HeaderTemplate>
                        <DataTemplate>
                            <Border>
                                <TextBlock Text="{Binding Key}"
                                           VerticalAlignment="Center" HorizontalAlignment="Center"
                                           Style="{StaticResource TextBlockMedium}"
                                           Padding="5" Margin="5" FontWeight="SemiBold" />
                            </Border>
                        </DataTemplate>
                    </GroupStyle.HeaderTemplate>
                </GroupStyle>
            </ListView.GroupStyle>-->
        </ListView>

    </Grid>
</UserControl>

所以我已经评论了ItemsControl的整个部分，但这并没有解决问题。当Popup打开时，显示包含的项目仍需要一段时间。

滚动时速度不慢，渲染初始项目的速度很慢。

Answer 1

问题出在显示ItemsControl集合的MobileNumbers。对于另一个ItemsControl（在您的情况下，ItemTemplate），您不应该ItemsControl为ListView。只有在显示少量项目时才能这样做。

因此，MobileNumbers项目未被虚拟化，这就是性能问题的来源，因为需要显示所有项目来呈现项目模板。

您可以尝试创建对象的平面列表，然后使用ItemTemplateSelector显示不同类型的不同项目模板。例如，您可以将以下ObservableCollection作为ItemsSource：

Header
Contact info
Mobile number1
Mobile number2
Header
Contact info
Mobile number
etc.

WP8.1弹出窗口 - 渲染速度慢

1 个答案: