使用ExpanderView&绑定(Windows Phone 7)

时间:2012-05-07 13:37:14

标签: windows-phone-7 xaml binding silverlight-toolkit

我有一个Panorama控件,它有一个ExpanderView Item(来自Silverlight工具包)。 我的客户希望此页面可以自定义。这就是我创建3级绑定的原因: PanoramaItems,ExpanderView头文件和ExpanderView内容。 我设置Panorama控件的itemssource时的问题。显示项目大约需要5秒钟。

知道如何解决这个问题吗?

C#代码:

private void panorama_Loaded(object sender, RoutedEventArgs e)
{
        this.DataContext = App.Products; 
}

XAML代码:

<controls:Panorama Loaded="panorama_Loaded" x:Name="panorama" ItemsSource="{Binding}">
        <controls:Panorama.ItemTemplate>
            <DataTemplate>
                <ListBox  ItemsSource="{Binding Sub_Products}" >
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <toolkit:ExpanderView  Header="{Binding}" Expander="{Binding}" ItemsSource="{Binding Sub_Sub_Products}">
                                <toolkit:ExpanderView.ExpanderTemplate>
                                    <DataTemplate>
                                        <StackPanel Orientation="Horizontal">
                                            <Image VerticalAlignment="Center" Source="Images/List.png" Width="25" />
                                            <TextBlock Text="{Binding Title}" />
                                        </StackPanel>
                                    </DataTemplate>
                                </toolkit:ExpanderView.ExpanderTemplate>
                                <toolkit:ExpanderView.ItemTemplate>
                                    <DataTemplate>
                                        <Grid Margin="-30,0,0,0" Background="White"  Width="450" Tap="Grid_Tap" >
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="Auto" />
                                                <ColumnDefinition Width="*" />
                                            </Grid.ColumnDefinitions>
                                            <Grid.RowDefinitions>
                                                <RowDefinition Height="Auto" />
                                                <RowDefinition Height="*" />
                                            </Grid.RowDefinitions>
                                            <Image Grid.Row="0"  Source="{Binding ImageSource}" />
                                            <StackPanel  VerticalAlignment="Top" Grid.Column="1">
                                                <TextBlock Text="{Binding Title}"  />
                                                <TextBlock Text="{Binding Description}"  />
                                                <Grid>
                                                    <Grid.ColumnDefinitions>
                                                        <ColumnDefinition Width="Auto" />
                                                        <ColumnDefinition Width="*" />
                                                    </Grid.ColumnDefinitions>
                                                    </Grid>
                                                <TextBlock Margin="0,12,32,0" Grid.Row="1" Text="Learn more" />
                                            </StackPanel>
                                        </Grid>
                                    </DataTemplate>
                                </toolkit:ExpanderView.ItemTemplate>
                            </toolkit:ExpanderView>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </DataTemplate>
        </controls:Panorama.ItemTemplate>
    </controls:Panorama>

2 个答案:

答案 0 :(得分:1)

您可以尝试折叠屏幕外的全景项目,并仅根据需要将可见性设置为可见。这应该至少减少可见树的大小。

找到慢速部分的好方法是在Visual Studio中使用分析器。你会发现一个帧非常慢(在你的情况下它的渲染时间为5秒)。然后深入了解该框架的可视化树,看看哪些元素需要很长时间才能渲染并尝试优化这些元素。

答案 1 :(得分:0)

删除xaml中的ExpanderView ItemsSource绑定,并在代码中填充Expander时绑定到它。只需将其保留为ItemsSource="{Binding}"即可。这样,当用户点击扩展器时,您将动态构建可视树。

事件处理程序如下所示。 我假设Product是App.Products列表中的类型 。还要确保在xaml中为扩展器连接事件。

 private void ExpanderView_ManipulationStarted(object sender, System.Windows.Input.ManipulationStartedEventArgs e)
        {
            var expander = sender as ExpanderView;
            expander.ItemsSource = (expander.DataContext as Product).Sub_Sub_Products;
        }

希望这可以解决您的缓慢加载问题,此时此刻还不算太晚。