Windows Phone Panorama + Probleme mit der Datenbindung

Question

Ich hätte gerne jeden Buchstaben des Alphabets als Windows Phone PanoramaItem. Bitte akzeptiere es einfach an dieser Stelle. Jeder Buchstabe wird auf verschiedene Arten angezeigt (kursiv, normal, fett, andere Schriftarten ...). Natürlich könnte ich es manuell machen, aber es ist unflexibel. Also habe ich beschlossen, eine einfache Letter-Klasse zu schreiben, die grundsätzlich zwei Zeichen enthält - Groß- und Kleinschreibung eines Buchstabens. Die Idee war, eine Sammlung dieser Buchstaben an das Panorama zu binden (myPano.ItemsSource = collection;). Hier ist die Vorlage:

<DataTemplate 
     x:Name="LetterTemplate"> 
     <controls:PanoramaItem 

      Background="Black" 
      HorizontalAlignment="Stretch" 
      Name="{Binding Path=UpperCase}" 
      ManipulationCompleted="A_ManipulationCompleted" 
      > 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="0.5*"/> 
       <RowDefinition Height="0.5*"/> 
      </Grid.RowDefinitions> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="0.5*"/> 
       <ColumnDefinition Width="0.5*"/> 
      </Grid.ColumnDefinitions> 
      <StackPanel 
       Grid.Row="0" 
       Grid.Column="0" 
       Orientation="Vertical" 
       HorizontalAlignment="Stretch"> 
       <TextBlock 
        Text="{Binding Path=UpperCase}" 
        Foreground="{StaticResource PhoneAccentBrush}" 
        HorizontalAlignment="Center" 
        FontFamily="Segoe WP" 
        FontSize="100" /> 
       <TextBlock 
        Text="{Binding Path=UpperCase}" 
        HorizontalAlignment="Center" 
        Foreground="White" 
        FontFamily="Courier New" 
        FontSize="100" /> 
      </StackPanel> 
      <StackPanel 
       Grid.Row="0" 
       Grid.Column="1" 
       Orientation="Vertical" 
       HorizontalAlignment="Stretch"> 
       <TextBlock 
        Text="{Binding Path=UpperCase}" 
        Foreground="White" 
        HorizontalAlignment="Center" 
        FontFamily="Segoe WP" 
        FontStyle="Italic" 
        FontSize="100" /> 
       <TextBlock 
        Text="{Binding Path=UpperCase}" 
        HorizontalAlignment="Center" 
        Foreground="{StaticResource PhoneAccentBrush}" 
        FontStyle="Italic" 
        FontFamily="Courier New" 
        FontSize="100" /> 
      </StackPanel> 
       <StackPanel 
       Grid.Row="1" 
       Grid.Column="0" 
       Orientation="Vertical" 
       HorizontalAlignment="Stretch"> 
        <TextBlock 
        Text="{Binding Path=LowerCase}" 
        Foreground="{StaticResource PhoneAccentBrush}" 
        HorizontalAlignment="Center" 
        FontFamily="Segoe WP" 
        FontStyle="Italic" 
        FontSize="100" /> 
        <TextBlock 
        Text="{Binding Path=LowerCase}" 
        HorizontalAlignment="Center" 
        Foreground="White" 
        FontStyle="Italic" 
        FontFamily="Courier New" 
        FontSize="100" /> 
       </StackPanel> 
       <StackPanel 
       Grid.Row="1" 
       Grid.Column="1" 
       Orientation="Vertical" 
       HorizontalAlignment="Stretch"> 
        <TextBlock 
        Text="{Binding Path=LowerCase}" 
        Foreground="White" 
        HorizontalAlignment="Center" 
        FontFamily="Segoe WP" 
        FontStyle="Italic" 
        FontSize="100" /> 
        <TextBlock 
        Text="{Binding Path=LowerCase}" 
        HorizontalAlignment="Center" 
        Foreground="{StaticResource PhoneAccentBrush}" 
        FontStyle="Italic" 
        FontFamily="Courier New" 
        FontSize="100" /> 
       </StackPanel> 
      </Grid> 
    </controls:PanoramaItem> 

Ich weiß, es ist nicht sehr leistungsorientiert, wenn für Windows Phone Programmierung, aber wir es auf diese Weise lassen sich jetzt.

Das Panorama wurde im Konstruktor der Telefonseite mit einer einfachen Schleife gefüllt, die vom Zeichencode 'A' nach 'Z' wandelte, den entsprechenden Buchstaben erzeugte und zur alphabetischen Sammlung hinzufügte. Es funktionierte gut, war aber langsam: Ich musste ca. 3 Sekunden warten, bis es angezeigt wurde, was nicht akzeptabel ist.

Meine erste Lösung dieses Problems bestand darin, die Alphabet-Sammlung auf 5 Buchstaben zu beschränken und 4 davon zu bearbeiten, wenn sich die Auswahl ändert. Ich habe mehrere Ansätze ausprobiert, aber im Grunde besteht mein Problem darin, die PanoramaItems zu aktualisieren, wenn die Änderung passiert ist.

Entfernen und fügen Sie Briefe aus der Sammlung: Zerstört die schönen Übergänge, auf keinen Fall. Veranlassen Sie, dass die Sammlung CollectionChanged auslöst, wenn sich eine Eigenschaft eines enthaltenen Letter ändert: Es wurde wie zuvor versucht. UpdateTarget() of BindingExpression: Die Methode scheint in .NET CE nicht verfügbar.

Vielleicht habe ich etwas übersehen oder nur völlig ungeeignete Ansätze verfolgt. Wie würdest du es machen?

Vielen Dank im Voraus!

Answer 1

Der Vollständigkeit halber: Ich habe es auf die erste Weise (26 PanoramaItems) jetzt verlassen, nur die StackPanels in meinem DataTemplate entfernt und die ObservableCollection in eine Liste geändert. Nach this tips & tricks entry hätte ich daher einen kleinen Leistungsschub bekommen sollen. Es ist in Ordnung.

Immer noch ... Wenn Sie eine Lösung für mein spezifisches Problem der Aktualisierung eines einzelnen PanoramaItem (Bindungsziel) auf Windows Phone kennen, lassen Sie es mich wissen.

Mit freundlichen Grüßen.

Answer 2

Wenn Sie die folgende Klassenstruktur verwenden:

class LetterContainer 
{ 
    public Letter Letter { get; set; } 
} 

class Letter 
{ 
    public String UpperCase { get; set; } 
    public String LowerCase { get; set; } 
} 

Und anstatt eine Liste der Klasse erstellen Letter, erstellen Sie eine Liste vom Typ LetterContainer mit Parorama Kontrolle zu binden. Natürlich müssen Sie die Bindungen, die Sie erstellt haben, in Ihrem Template ändern. Alles, was Sie jetzt tun, ist Werte in Letter Eigenschaft in LetterContainer Objekte zu ändern. Auf diese Weise werden keine CollectionChanged Ereignisse ausgelöst. Aber stellen Sie sicher, dass Sie PropertyChanged Ereignisse für Letter, UpperCase und LowerCase Eigenschaften auslösen.

Answer 3

Bedenken Sie, dass 26 PanoramaItems die Leistung verlangsamen können.

Mit Blick auf dem ersten Aufzählungspunkt im Best Practices section here, heißt es:

Sicherstellen Panorama Anwendungen ausführen reibungslos durch die Anzahl der Abschnitte zu einem Maximum von vier Abschnitten verwendet zu begrenzen. Wenn Ihr Inhalt dicht ist oder wenn viele Ihrer Bereiche mehrere gehostete Steuerelemente verwenden, sollten Sie noch weniger Abschnitte verwenden.

Answer 4

Danke für die Antworten!

@decyclone: ​​Seltsam, ich habe deine nicht gesehen ... Wie auch immer, vielleicht werde ich es versuchen. Ich frage mich nur, wie unterschiedlich es zu meiner Lösung mit der Kollektion ist. Ich habe das NotifyPropertyChanged-Zeug in Letter implementiert und abgefeuert, aber das PanoramaItem wurde nicht automatisch aktualisiert. Warum sollte es das jetzt tun?

@MartinHN: Ich weiß, es ist nicht die beste Lösung, wenn es um Leistung geht. Das ist, was ich im ersten Eintrag sagte und der Grund, warum ich hier fragte :)