C# [Metro] Dynamisches Tile-Layout

holy

Lieutenant
Registriert
Aug. 2008
Beiträge
534
Hallo ihr,

ich grübel nun schon eine Weile über folgende Umsetzung nach, komme aber zu keinem zufriedenstellenden Ergebnis.

Falls ihr Windows 8 bereits getestet habt, solltet ihr direkt wissen, was ich versuche zu erreichen. In der Music Preview im Collection View werden die Cover aller Albem angezeigt. Klickt man auf ein Album, erscheint rechts neben dem ausgewählten Album ein weiteres Panel, welches weitere Details enthält. Dieses Panel erscheint immer rechts und nimmt die volle Höhe des darunter liegenden Panels ein.

Ich versuche nun ähnliches hinzukriegen. Ich hab zwei Grafiken angehangen, falls jmd. nicht weiß, was ich meine.

Mein XAMl sieht (momentan) so aus
Code:
<ScrollViewer ...>
  <ListView ...ItemsSource="{Binding}">
    <ListView.ItemsPanel>
      <ItemsPanelTemplate>
        <WrapGrid ... />
      </ItemsPanelTemplate>
    <ListView.ItemsPanel>
    <ListView.ItemTemplate>
      <DataTemplate>
        ...
      </DataTemplate>
    </ListView.ItemTemplate>
  <ListView>
</ScrollViewer>

Wie man sieht werden die Items über ein ViewModel erzeugt. Mein Problem ist nun das DataTemplate.
Mein erster Versuch war ein StackPanel. Logischerweise endete es damit, dass ich zwar die Details anzeigen konnte, allerdings nicht auf voller Höhe.
Nächster Versuch Grid. Funktioniert, leider verlier ich dadurch aber die Anordnung im WrapGrid. Soll heißen, dass nach Auswahl eines Items, das darüber oder darunter liegende versetzt angezeigt wird.

Nachdem ich so kläglich gescheitert bin, habe ich versucht das "Details-Panel" direkt über den Code-Behind einzufügen. Im Nachhinein erscheint mir dieser Weg am logischten. Verschiedene Styles und Templates für die entsprechenden Objecte in der gebundenen Collection.
Leider endet dieser Versuch entweder in einer catastrophic exception oder damit, dass ich rausfinde, dass die hälfte der im MSDN dokumentierten Methoden auf Grund irgendwelcher (sinnlosen) Protection-Level mir an dem Punkt nicht zur Verfügung stehen ;(

Hat jemand eine Idee, wie man das beschrieben Layout erreichen kann? Bin momentan etwas ratlos.
Ergänzung ()

OK.
Ein Mix aus Fehler im eigenen Code fixen, TemplateSelector richtig implementieren und VariableSizedWrapGrid anstelle eines WrapGrids benutzen führt zum Erfolg :)
 

Anhänge

  • unselected.png
    unselected.png
    13 KB · Aufrufe: 150
  • selected.png
    selected.png
    14,8 KB · Aufrufe: 231
Zuletzt bearbeitet:
Zurück
Oben