contruction d'une liste : bonne méthode

Version imprimable

Bonjour,

Débutant en silverlight, sur un projet assez conséquent, je me pose pas mal de question sur la bonne méthode a utiliser pour créer mon objet graphique.

Ma question précise.
pour faire simple j'ai un objet chargé en code behind, on va prendre une liste de Personne où une personne à un nom,un prenom et un sexe (qui va prendre toute son importance.)

J'essaie de créer une liste XAML ou je vais afficher mes noms et prenoms.

Après une construction complète en C#, j'ai créer un template ou je bindais 2 textblock sur mes property nom et prenom. Jusque là ca allait, mais j'ai du aller plus loin dans ma liste : effet de survol, selection, et affichage différent selon le sexe.

je me suis basé sur l'article suivant : http://mark-dot-net.blogspot.com/200...ht-part-3.html

J'arrive a créer mon élément mais j'ai cassé le binding à ce moment là.

Plus j'avance et plus je pense ne pas avoir aborder mon problème par le bon bout.

mon code :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 <StackPanel Background="AliceBlue"> <StackPanel.Resources> <Style TargetType="ListBoxItem" x:Key="lstItem"> <Setter Property="Padding" Value="0"></Setter> <Setter Property="Foreground" Value="Red"></Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ListBoxItem"> <StackPanel Background="Aqua"> <TextBlock x:Name="prenom" Text="{Binding Path=prenom}"></TextBlock> <TextBlock x:Name="nom" Text="{Binding Path=nom}"></TextBlock> <ContentPresenter Content="{TemplateBinding Content}" /> </StackPanel> </ControlTemplate> </Setter.Value> </Setter> </Style> <Style TargetType="ListBox" x:Key="lst"> <Setter Property="Width" Value="180"></Setter> <Setter Property="Padding" Value="0"></Setter> <Setter Property="Margin" Value="0"></Setter> <Setter Property="ItemContainerStyle" Value="{StaticResource lstItem}" /> <Setter Property="ItemsSource" Value="iLstPersonne"></Setter> </Style> </StackPanel.Resources> <ListBox Style="{StaticResource lst}" Name="lstPersonneXaml"> </ListBox> </StackPanel>
et en code behind je lie ma liste a ma liste d'objet C#.
ma liste est remplie

Code:

lstPersonneXaml.ItemsSource = iLstPersonne;

Qu'en pensez vous ?

En fait je voudrais faire un peu la même chose que dans l'article cité en ajoutant un lien entre ma liste Xaml, et ma liste d'objet.

Bonjour,

Tu peux enlever ça déjà :

Code:

<Setter Property="ItemsSource" Value="iLstPersonne"></Setter>

Dans ton cas la meilleur chose à faire je pense est de déclaré une property dependency cote code (snippet propdp) pour que ta liste soit Bindable puis dans ton constructeur tu lies le DataContext avec ton usercontrol (ça peut être MainPage) contenant la listbox :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 // Constructeur public MainPage() { this.InitializeComponent(); this.LayoutRoot.DataContext = this; // ici le dataContext devient MainPage // on instancie la propdp this.iLstPersonnes = new ObservableCollection<Personne>(); } // ici declare ta propdp iLstPersonne de type ObservableCollection<Personne>
coté xaml (sur MainPage.xaml)
Code:

1 2 3 <ListBox Style="{StaticResource lst}" Name="lstPersonneXaml" ItemsSource="{Binding iLstPersonne}"> </ListBox>
C'est une solution parmi d'autre...

Merci pour ta réactivité.

Code:

<Setter Property="ItemsSource" Value="iLstPersonne"></Setter>

c'était un reliquat de mes différents essais...

J'ai donc transformé ma liste en ObservableCollection, mais ma liste ne s'affiche toujours pas, bien qu'elle soit rempli.

le xaml

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<StackPanel Background="AliceBlue" Name="LayoutRoot">
        <StackPanel.Resources>
            <Style TargetType="ListBoxItem" x:Key="lstItem">
                <Setter Property="Padding" Value="0"></Setter>
                <Setter Property="Foreground" Value="Red"></Setter>                
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListBoxItem">
                            <StackPanel Background="Aqua">
                                <TextBlock x:Name="prenom" Text="{Binding Path=prenom}"></TextBlock>
                                <TextBlock x:Name="nom" Text="{Binding Path=nom}"></TextBlock>
                                <ContentPresenter Content="{TemplateBinding Content}"   />
                            </StackPanel>
                        </ControlTemplate>                         
                    </Setter.Value>
                </Setter>
            </Style>
 
            <Style TargetType="ListBox" x:Key="lst">
                <Setter Property="Width" Value="180"></Setter>
                <Setter Property="Padding" Value="0"></Setter>
                <Setter Property="Margin" Value="0"></Setter>
                <Setter Property="ItemContainerStyle" Value="{StaticResource lstItem}"  />                
             </Style>
 
        </StackPanel.Resources>
 
        <ListBox Style="{StaticResource lst}" Name="lstPersonneXaml" ItemsSource="{Binding iLstPersonne}"/>
 
        <Button Content="Bouton" Click="Button_Click"></Button>
        <TextBlock Name="lblInfo"></TextBlock>
 
    </StackPanel>

le code behind.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 public ObservableCollection<Personne> iLstPersonne;// = new ObservableCollection<Personne>();
 
        public MainPage()
        {
            this.InitializeComponent();
 
            // ici le dataContext devient MainPage
            this.LayoutRoot.DataContext = this;
 
            // on instancie la propdp 
            this.iLstPersonne = new ObservableCollection<Personne>();
 
            Personne oPers = new Personne();
            oPers.CreatePersonne("BOLT", "Usain");
            iLstPersonne.Add(oPers);
            oPers = new Personne();
            oPers.CreatePersonne("BRICO", "Judas");
            iLstPersonne.Add(oPers);
            oPers = new Personne();
            oPers.CreatePersonne("ROUX", "Guy");
            iLstPersonne.Add(oPers);
 
            //on charge la liste dans sa listbox
            //lstPersonneXaml.ItemsSource = iLstPersonne;            
        }

15/09/2010, 15h56
filobilo

1 pièce(s) jointe(s)
Ce qui est intérressant, c'est que si au lieu de mettre un binding sur ma liste, je la charge dans mon code behind
Code:

1 2 //on charge la liste dans sa listbox lstPersonneXaml.ItemsSource = iLstPersonne;
alors à ce momemt la ma listBox s'affiche, sauf qu'au lieu de m'afficher mes property elle m'affiche l'objet.

Je vois ton problème, tu utilise Template au lieu de de DataTemplate
remplace ceci :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListBoxItem">
                            <StackPanel Background="Aqua">
                                <TextBlock x:Name="prenom" Text="{Binding Path=prenom}"></TextBlock>
                                <TextBlock x:Name="nom" Text="{Binding Path=nom}"></TextBlock>
                                <ContentPresenter Content="{TemplateBinding Content}"   />
                            </StackPanel>
                        </ControlTemplate>                         
                    </Setter.Value>
                </Setter>

par ceci :

Code:

1
2
3
4
5
6
7
8
9
10
11
                <Setter Property="ItemTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <StackPanel Background="Aqua">
                                <TextBlock x:Name="prenom" Text="{Binding Path=prenom}"></TextBlock>
                                <TextBlock x:Name="nom" Text="{Binding Path=nom}"></TextBlock>
Content}"   />
                            </StackPanel>
                        </DataTemplate>                         
                    </Setter.Value>
                </Setter>

tu peux oublier le Binding de la ListBox (ainsi que le Layout.DatContext du constructeur) si tu fixes directement ta donnée comme tu le fais actuellement.

15/09/2010, 17h04
filobilo

Oui j'avais créer un data template au départ, puis je suis parti ensuite sur le template pour implémenter l'objet visualstatemanager pour gérer mes différents états.

Je peux apparement implémenter le visualstatemanager sur le dataTemplate.

Merci pour tes recommandations.
15/09/2010, 17h09
Samuel Blanchard

Rien ne t'empeche d'utiliser un Template aussi pour tes VisualStates mais ce n'est pas recommandé de l'utiliser pour le Binding de données.

Pour faire simple ;)

Binding -> DataTemplate
TemplateBinding -> ControlTemplate

Bon courage !