Discussion :

[Michel38]

Bonjour à tous,

Ca fait quelques temps que je cherche en vain...
J'essaie de reproduire ce que j'avais en Winform. En gros je veux ajouter dynamiquement dans un conteneur (Panel) plusieurs conteneurs (en Winform j'avais pris des usercontrol).

Un usercontrol lui, étant composé de deux labels mis l'un sous l'autre.

Pour être plus clair, j'ai un conteneur B qui contient deux labels.
Et je veux utiliser un conteneur A qui peut contenir 1 ou plusieurs Conteneurs B.

Je ne sais pas trop quel conteneur utiliser pour le A comme pour le B.
D'autant que l'ajout des conteneurs B dans le A doit être fait dynamiquement.

De plus, j'ai des événements quand je clique sur le conteneur B.

Quels conseils pouvez-vous me donner pour me faire avancer ?

Je vous remercie.

Michel

[Pol63]

en wpf tu peux faire comme en windows forms
faire des usercontrol avec des labels ou autre
mettre des containers ou des controls dans d'autres containers

les containers sont :
canvas : container qui permet de positionner les enfants avec x et y (un peu comme en Windows forms de base)
grid : permet de positionner en grille via des lignes et des colonnes (équivaut au tablelayoutpanel en mieux)
stackpanel/wrappanel : équivaut à flowlayoutpanel (en légèrement mieux aussi)
dockpanel : permet de docker (on peut faire ca en Windows forms aussi)
uniformGrid : grid avec des cases de même taille
(je pense ne pas en avoir oublié, en uwp on a aussi le relativepanel, on peut aussi en créer avec d'autres fonctionnalités)

tous ces panels ont une propriété Children qui est une collection de uielement je crois, donc on peut faire children.add (c'est ce qui est quand on écrit le contenu en XAML)

néanmoins en wpf on fait rarement ça, ce n'est pas fait pour être utilisé comme les winforms, et il faut désapprendre ce qu'on faisait avant pour aller dans la philosophie de wpf, et ca fait un peu bizare au début

exemple :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
public class Film 
{
  public Film() 
  {
     DropFilmCommand = new relaycommand(DropFilm);
  }
 
  public string Nom {get;} 
  public string Description{get;}
  public datetime DateSortie {get;} 
  public bool DejaVu {get;set;}
 
  public relaycommand DropFilmCommand {get;}
 
  public void DropFilm() 
  {
     // remove film from database and collection
  }
}

pour les afficher tu fais

Code XAML :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<ItemsControl itemssource="{binding LesFilms}">
  <ItemsControl.ItemsPanel>
      <ItemsPanelTemplate>
           <WrapPanel Orientation="Horizontal"/>
      </ItemsPanelTemplate>
  </ItemsControl.ItemsPanel>
  <ItemsControl.ItemTemplate>
    <DataTemplate>
        <Border BorderThickness="2">
             <StackPanel Orientation="Horizontal"> 
                 <Expander Header="{Binding Nom}">
                     <TextBlock Text="{Binding Description}"/>
                 </Expander>
                 <TextBlock Text="{Binding DateSortie}"/>
                 <CheckBox IsChecked="{Binding DejaVu, Mode=TwoWay}"/>
                 <Button Content="Supprimer" Command="{binding DropFilmCommand}"/>
            </StackPanel> 
        </Border>
    </DataTemplate>
  </ItemsControl.ItemTemplate>
</ItemsControl>

ItemsControl c'est un listbox sans sélection possible
ItemsPanelTemplate c'est pour dire quel panel sera utilisé par l'itemscontrol (par défaut ca doit être un stackpanel) le wrappanel permet d'afficher en ligne et d'aller à la ligne en fin de ligne
ItemTemplate permet de décrire comment sera affiché un item

pour le binding il faut parfois mettre en place le pattern observer sur les classes

les datatemplates peuvent être définis en tant que ressources pour plus de lisibilité, et peuvent assosier à un type (classe) au niveau de l'appli (ca équivaut à un usercontrol d'une certaine manière)
comme ça partout où cette classe sera retrouve dans l'arbre d'affichage elle sera affichée de cette manière (même dans un contentpresenter par exemple)

pour l'évènementiel simple (équivalent à button.click) on utilise la classe relaycommand (le code source se trouve sur le net), comme présenté dans l'exemple ca permet de faire une propriété qui pointe vers un void
et donc on peut utiliser le binding sur la propriété Command de la classe button qui est utilisé lors du clic
pour le reste il y a des behaviours qui permettent de faire la même chose je crois (sinon on peut écrire nomevent="nom method dans la classe du form")



d'une manière générale le code des fenetre ne doit pas faire référence à des controles, d'ailleurs on donne rarement des noms au controles
c'est le XAML qui vient piocher les données par binding (voir MVVM)
donc si on doit afficher des collections, on utilise un control fait pour afficher des collections (itemscontrol/listbox/listview/datagrid) et on dit comment les choses s'affichent ou s'éditent
en changeant le Template à la volée suite à un clic sur un bouton modifier on peut même passer des labels au textboxes par exemple
si le pattern observer est implémenté changer une propriété dans le code change l'affichage automatiquement, et pour les collections il y a ObservableCollection qui est un List avec un event CollectionChanged
donc faire LesFilms.Add(New Film()); fait que l'itemscontrol va l'ajouter à la suite automatiquement

[Michel38]

Je te remercie infiniment pour tes conseils.
Je vais faire le tri par rapport à ce que j'avais déjà fait.


Michel