Discussion :

[Ikit]

Bonjour,

J'ai encore un peu de mal à discerner les différentes possibilités de WPF, aussi j'aimerais votre avis sur une question architecture

J'ai une liste d'élément que je dois présenter dans au moins 3 listes d'aspect différents


J'aimerais donc fait une classe commune "carrousel" qui à partir de cette liste et d'une propriété du genre "display" afficherait la liste sous une forme ou une autre.

En fouillant sur le net je tombe sur tout un tas de concept : datatemplate, itemControl, itemPresenter, contentPresenter, itemContent...

bref je nage, je sais qu'est-ce qui fait quoi comment, et tout les noms se ressemble...
Donc plutôt que de partir dans toutes les directions, j'aimerais qu'on me dise une façon de faire "élégante", et je me concentrerais sur celle là.

voili voilà

[Thomas Lebrun]

Pour moi, je vois un contrôle de type ItemsControl avec 3 ItemTemplate différents.

[Jérem22]

Pour le contrôle à choisir:

• si tu veux gérer la notion de sélection, alors utilise un ListBox
• sinon utilises un ItemsControl

Pour le rendu graphique de tes élements, tu as plusieurs possibilités.

• si tes éléments sont des classes différentes (classe mère ItemBase + Item1, Item2 et Item3 qui en héritent)

Tu peux utiliser un DataTemplate en spécifiant TargetType. Tu crée ainsi 3 DataTemplate (pour Item1, Item2 et Item3). Ton ItemsControl utilisera alors automatiquement le bon DataTemplate en fonction du type de l'objet (Item1, Item2 ou Item3).

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<Window.Resources>
  <DataTemplate TargetType={x:Type Item1}>
   ...
  </DataTemplate>
  <DataTemplate TargetType={x:Type Item2}>
   ...
  </DataTemplate>
  <DataTemplate TargetType={x:Type Item3}>
   ...
  </DataTemplate>
</Window.Resources>

• si tes éléments sont dans la même classe, et que tu les distingues par une propriété (par exemple Display qui vaut 1, 2 ou 3)

Tu peux utiliser un seul DataTemplate que tu associes à la propriété ItemTemplate du ton ItemsControl. Tu peux ensuite utiliser un DataTrigger pour tester la valeur de la propriété Display et faire varié l'affichage en fonction.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<DataTemplate x:key="dt">
    ...
    <DataTemplate.DataTrigger>
      <DataTrigger Property="Display" Value="1">
        <Setter ... />
      </DataTrigger>
    </DataTemplate.DataTrigger>
</DataTemplate>
 
<ItemsControl ... ItemTemplate={StaticResource dt}/>

Dans les 2 cas, pour remplir le contrôle (ListBox ou ItemsControl) utilises une ObservableCollection que tu associes à la propriété ItemsSource par binding.

[Thomas Lebrun]

Tu peux utiliser un seul DataTemplate que tu associes à la propriété ItemTemplate du ton ItemsControl. Tu peux ensuite utiliser un DataTrigger pour tester la valeur de la propriété Display et faire varié l'affichage en fonction.

Je trouver, personnellement, cette technique un peu plus lourde à mettre en place... Je préfère la première suggestion, celle avec les 3 DataTemplates.

[Jérem22]

Effectivement, ça dépend des cas

Si on veut juste changer une couleur alors c'est aussi plus lourd d'avoir 2x le même DataTemplate (à la couleur pret).

[Ikit]

Et en fait c'est quoi la différence entre un DataTemplate et un ControleTemplate ?
C'est juste que le controleTemplate est appliqué à un UserControle et que le DataTemplate peut être associé à n'importe quel class ?


Sinon les DataTemplates dont vous me parlez, sont ceux définit pour les items de ma liste. Pour personnaliser l'arrangement de mes items dans ma listBox ou mon ItemsControl c'est en surchargeant les méthodes MeasureOverride et ArrangeOverride c'est ça ?

[Jérem22]

Un DataTemplate sert à donner une réprésentation visuelle à une classe. Un ControlTemplate sert à donner un visuel à un contrôle (par exemple dans le ControlTemplate d'un ListBox, on trouve un ScrollViewer, des ScrollBars, etc.).

Pour jouer sur l'arrangement de tes items, utilises la propriété ItemsPanel. Par défaut, c'est un VirtualizingStackPanel, mais tu peux mettre n'importe quel panel dedans