ExpanderView＆Binding（Windows Phone 7）の使用時にページ読み込みが遅い

Question

SilverlightツールキットのExpanderView Itemを持つPanoramaコントロールがあります。 クライアントがこのページをカスタマイズできるようにしたいと考えています。それで、3レベルのバインディングを作成した理由： PanoramaItems、ExpanderViewヘッダー、ExpanderViewコンテンツ パノラマコントロールのアイテムソースを設定するときの問題。アイテムを表示するのに約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> 

Answer 1

あなたが画面から外れており、オンデマンドでのみ表示に可視性を設定するパノラマ項目を崩壊しようとすることができます。それは、少なくとも可視のツリーのサイズを減らすはずです。

遅い部分を見つける良い方法は、Visual Studioでプロファイラを使用することです。あなたは本当に遅い（あなたの場合は5秒のレンダリング時間を持つ）1つのフレームを見つけるでしょう。そのフレームのビジュアルツリーを掘り下げ、どの要素がレンダリングに時間がかかっているかを見て、これらの要素を最適化しようとします。

Answer 2

xamlでExpanderView ItemsSourceバインディングを削除し、Expanderがコードで管理されている場合にバインドします。ちょうどそれをItemsSource="{Binding}"のままにしておきます。こうすることで、ユーザーがエキスパンダーをタップすると、ビジュアルツリーが動的に構築されます。

イベントハンドラは以下のようなものです。 私は、製品がApp.Productsリストのタイプであると仮定していますです。また、エクスパンダ用のxamlにイベントを接続するようにしてください。

これは、遅い読み込みの問題を解決していますが、今は遅すぎません。