Discussion :

[LMA-Travel]

Bonjour,

je débute en wpf, je dispose d'une liste d'objet A qui contient une liste d'objets B qui, elle aussi, contient une autre liste d'objets C

A => List_B
B => List_C

Je voudrai afficher dans une colonne de DataGrid un TreeView dont le contenu sera comme ça :

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
 
 
 +Objet_A1
               Objet_B1
               Objet_B2
              + Objet_B3
                           Objet_C1
                           Objet_C2
                           Objet_C3
 
  +Objet_A2
               Objet_B3
               Objet_B4
              + Objet_B5
                           Objet_C4
                           Objet_C5
                           Objet_C6

Peut on le faire avec XAML sans pour autant passer au code ?

Chaque Objet A,B et C dispose de sa propre classe.

Quelqu'un peut m'aider ?

Merci

[Pragmateek]

Tu peux utiliser une DataGridTemplateColumn et dans le template utiliser un TreeView.

[LMA-Travel]

Tu peux utiliser une DataGridTemplateColumn et dans le template utiliser un TreeView.

Merci d'avoir répondu, j'arrive à mettre le TreeView mais j'arrive pas à le remplir... J'obtiens le TreeView vide.

[Pragmateek]

Il faut indiquer l'ItemsSource du TreeView en la bindant à la propriété représentant l'objet "A" :

Code :

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

1
2
<TreeView ItemsSource="{Binding proprieteDontLeTypeEstAServantDeRacine}">
</TreeView>

[LMA-Travel]

Il faut indiquer l'ItemsSource du TreeView en la bindant à la propriété représentant l'objet "A" :

Code :

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

1
2
<TreeView ItemsSource="{Binding proprieteDontLeTypeEstAServantDeRacine}">
</TreeView>

Merci d'avoir repondu;

Effectivement , c'est ce que je fais, mais j'obtiens pas ce que je veux :

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
<DataGridTemplateColumn Header="A" IsReadOnly="True">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
 
                            <TreeView ItemsSource="{Binding A_List}">
                                <TreeView.ItemTemplate>
                                    <HierarchicalDataTemplate ItemsSource="{Binding B_List}" >
                                        <StackPanel Orientation="Horizontal">
                                            <TextBlock Text="{Binding B_Id}" />
                                            <TextBlock Text="{Binding B_C_ListCount}" />
                                        </StackPanel>
                                    </HierarchicalDataTemplate>
                                </TreeView.ItemTemplate>
                            </TreeView>
 
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

avce ce code j'obtiens une colonne vide.
Merci de revoir le code

[Pragmateek]

Il faut plusieurs templates, un par type.

Voici une façon de faire avec un modèle de données similaire :

Code C# :

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
using System.Collections.Generic;
using System.Windows;
 
namespace TreeViewInDG
{
    public class A
    {
        public string Label { get; set; }
        public IList<B> B_List { get; set; }
    }
 
    public class B
    {
        public string Label { get; set; }
        public IList<C> C_List { get; set; }
    }
 
    public class C
    {
        public string Label { get; set; }
    }
 
    public class Entity
    {
        public IList<A> A_List { get; set; }
    }
 
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
 
            dg.ItemsSource = new[]
            {
                new Entity
                {
                    A_List = new[]
                    {
                        new A
                        {
                            Label = "A #1",
                            B_List = new[]
                            {
                                new B
                                {
                                    Label = "A #1 / B #1",
                                    C_List = new[]
                                    {
                                        new C
                                        {
                                            Label = "A #1 / B #1 / C #1"
                                        },
                                        new C
                                        {
                                            Label = "A #1 / B #1 / C #2"
                                        }
                                    }
                                },
                                new B
                                {
                                    Label = "A #1 / B #2"
                                },
                                new B
                                {
                                    Label = "A #1 / B #2",
                                    C_List = new[]
                                    {
                                        new C
                                        {
                                            Label = "A #1 / B #2 / C #1"
                                        },
                                        new C
                                        {
                                            Label = "A #1 / B #2 / C #2"
                                        }
                                    }
                                },
                            }
                        }
                    }
                }
            };
        }
    }
}

Et le XAML :

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
22
23
24
25
26
27
28
29
30
31
<Window x:Class="TreeViewInDG.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:TreeViewInDG"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <DataGrid x:Name="dg">
            <DataGrid.Columns>
                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <TreeView ItemsSource="{Binding A_List}">
                                <TreeView.Resources>
                                    <HierarchicalDataTemplate DataType="{x:Type local:A}" ItemsSource="{Binding B_List}">
                                        <TextBlock Text="{Binding Label}"></TextBlock>
                                    </HierarchicalDataTemplate>
                                    <HierarchicalDataTemplate DataType="{x:Type local:B}" ItemsSource="{Binding C_List}">
                                        <TextBlock Text="{Binding Label}"></TextBlock>
                                    </HierarchicalDataTemplate>
                                    <DataTemplate DataType="{x:Type local:C}">
                                        <TextBlock Text="{Binding Label}"></TextBlock>
                                    </DataTemplate>
                                </TreeView.Resources>
                            </TreeView>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</Window>

[LMA-Travel]

Il faut plusieurs templates, un par type.

Voici une façon de faire avec un modèle de données similaire :

Code C# :

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
using System.Collections.Generic;
using System.Windows;
 
namespace TreeViewInDG
{
    public class A
    {
        public string Label { get; set; }
        public IList<B> B_List { get; set; }
    }
 
    public class B
    {
        public string Label { get; set; }
        public IList<C> C_List { get; set; }
    }
 
    public class C
    {
        public string Label { get; set; }
    }
 
    public class Entity
    {
        public IList<A> A_List { get; set; }
    }
 
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
 
            dg.ItemsSource = new[]
            {
                new Entity
                {
                    A_List = new[]
                    {
                        new A
                        {
                            Label = "A #1",
                            B_List = new[]
                            {
                                new B
                                {
                                    Label = "A #1 / B #1",
                                    C_List = new[]
                                    {
                                        new C
                                        {
                                            Label = "A #1 / B #1 / C #1"
                                        },
                                        new C
                                        {
                                            Label = "A #1 / B #1 / C #2"
                                        }
                                    }
                                },
                                new B
                                {
                                    Label = "A #1 / B #2"
                                },
                                new B
                                {
                                    Label = "A #1 / B #2",
                                    C_List = new[]
                                    {
                                        new C
                                        {
                                            Label = "A #1 / B #2 / C #1"
                                        },
                                        new C
                                        {
                                            Label = "A #1 / B #2 / C #2"
                                        }
                                    }
                                },
                            }
                        }
                    }
                }
            };
        }
    }
}

Et le XAML :

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
22
23
24
25
26
27
28
29
30
31
<Window x:Class="TreeViewInDG.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:TreeViewInDG"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <DataGrid x:Name="dg">
            <DataGrid.Columns>
                <DataGridTemplateColumn>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <TreeView ItemsSource="{Binding A_List}">
                                <TreeView.Resources>
                                    <HierarchicalDataTemplate DataType="{x:Type local:A}" ItemsSource="{Binding B_List}">
                                        <TextBlock Text="{Binding Label}"></TextBlock>
                                    </HierarchicalDataTemplate>
                                    <HierarchicalDataTemplate DataType="{x:Type local:B}" ItemsSource="{Binding C_List}">
                                        <TextBlock Text="{Binding Label}"></TextBlock>
                                    </HierarchicalDataTemplate>
                                    <DataTemplate DataType="{x:Type local:C}">
                                        <TextBlock Text="{Binding Label}"></TextBlock>
                                    </DataTemplate>
                                </TreeView.Resources>
                            </TreeView>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</Window>

Merci pour votre effort,

Pouvez vous m'éclairer sur DataType="{x:Type local:Object}", afin de mieux comprendre ?

Merci encore.

[Pragmateek]

Alors décomposons :
- DataType : propriété de la classe DataTemplate indiquant quel est le type .Net (représenté par une instance de la classe Type) visé par ce DataTemplate qui sera ainsi automatiquement appliqué aux éléments de ce type (ce qui permet d'avoir du polymorphisme au niveau du rendu),
- {x:Type} : markup-extension qui génère une instance de Type,
- local:A : token représentant le type souhaité : "local" c'est le nom du namespace XML correspondant au namespace C# "TreeViewInDG", et "A" le nom du type => c'est l'équivalent de typeof(TreeViewInDG.A) en C#

Et pourquoi pas simplement DataType="local:A" ?
Parce que DataType peut aussi désigner un élément XML, donc c'est l'un des cas (le seul?) où il faut expliciter son intention en utilisant la markup-extension TypeExtension.

Voilà tu sais tout maintenant.

[LMA-Travel]

Alors décomposons :
- DataType : propriété de la classe DataTemplate indiquant quel est le type .Net (représenté par une instance de la classe Type) visé par ce DataTemplate qui sera ainsi automatiquement appliqué aux éléments de ce type (ce qui permet d'avoir du polymorphisme au niveau du rendu),
- {x:Type} : markup-extension qui génère une instance de Type,
- local:A : token représentant le type souhaité : "local" c'est le nom du namespace XML correspondant au namespace C# "TreeViewInDG", et "A" le nom du type => c'est l'équivalent de typeof(TreeViewInDG.A) en C#

Et pourquoi pas simplement DataType="local:A" ?
Parce que DataType peut aussi désigner un élément XML, donc c'est l'un des cas (le seul?) où il faut expliciter son intention en utilisant la markup-extension TypeExtension.

Voilà tu sais tout maintenant.

Je vous remercie pour votre aide précieuse, si j'arrive à appliquer vos consignes je metterai le post comme résolu.
Merci encore.

[MABROUKI]

Bonjour
Le DataGrid.RowDetailsTemplate est plus approprie pour ce cas car il accepte un itemscontrol ce qui permet de fourguer un treeview equipe de son Hierachical DataTemplate....dans la colonne souhaite ou sera seulement un champ de la liste principale..
code exemple behind.cs du class data exemple (liste de liste herarchique):

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
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Collections.ObjectModel;
 
namespace WpfTreeViewInDGV
{
    public class ClassC
    {
        public ClassC(string s)
        {
            ID = s;
        }
        public string ID { get; set; }
 
    }
    //ce class necessite un datatemplate specifique
    //car il a un champ en plus 
    public class ClassB
    {
        public ClassB(string s,int n)
        {
            ID = s;
            Numero = n;
            Liste = new ObservableCollection<ClassC>();
        }
        public string ID { get; set; }
        public int Numero { get; set; }
        public ObservableCollection<ClassC> Liste { get; set; }
    }
    public class ClassA
    {
        public ClassA(string s)
        {
            ID = s;
            Liste = new ObservableCollection<ClassB>();
        }
        public string ID { get; set; }
        public ObservableCollection<ClassB> Liste { get; set; }
    }
 
    public class ListeDesListes : ObservableCollection<ClassA> 
    {
        private ClassC cl;
        private ClassB bl;
        private ClassA al;
        public ListeDesListes()
        { 
            for (int i = 0; i < 5; i++)
            {
                al = new ClassA("A"+i.ToString());
                for (int j = 0; j < 6; j++)
                {
                    bl = new ClassB ("B"+j.ToString(),(j+1)*10);
                    for (int k = 0; k < 4; k++)
                    {
                        cl = new ClassC("C" + j.ToString());
                        bl.Liste.Add(cl);
                    }
                    al.Liste.Add(bl);
                }
                this.Add(al);
            }
 
        }
    }
 
}

code xaml du winform utilisateur:

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<Window x:Class="WpfTreeViewInDGV.WinRowDetailsTreeView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:local="clr-namespace:WpfTreeViewInDGV"
        Title="WinRowDetailsTreeView" Height="300" Width="300">
    <Window.Resources>
        <local:ListeDesListes x:Key="l"></local:ListeDesListes>
        <!--expand the  TreeViewItem-->
        <Style TargetType="TreeViewItem">
            <Setter Property="IsExpanded" Value="True"/>
        </Style>
        <HierarchicalDataTemplate 
                x:Key="treeviewTemplate"
                ItemsSource ="{Binding Path=Liste}">
            <StackPanel Orientation="Horizontal" >
                <TextBlock Background="Red" Foreground="White"  Margin="5" Text="{Binding Path=ID}"/>
                <TextBlock Background="Yellow" Foreground="Blue"  Margin="5" Text="{Binding Path=Numero}"/>
            </StackPanel>
        </HierarchicalDataTemplate>
 
    </Window.Resources>
    <Grid>
        <DataGrid ItemsSource="{Binding Source={StaticResource l}}" 
                  AutoGenerateColumns="True" 
                  RowDetailsVisibilityMode="VisibleWhenSelected">
 
            <DataGrid.RowDetailsTemplate>
                <DataTemplate>
                    <TreeView  
                        ItemsSource="{Binding Liste}" 
                        ItemTemplate="{StaticResource treeviewTemplate}">
                    </TreeView>
                    <!--en general un itemscontrol:listbox,combobox,listview et...-->
                    <!--<ItemsControl
                        ItemsSource="{Binding taPropListe}" 
                        ItemTemplate="{StaticResource tonTemplate}" />-->
                </DataTemplate>
            </DataGrid.RowDetailsTemplate>
        </DataGrid> 
    </Grid>
</Window>

Bon code...

[handsome01]

Bonjour
Le DataGrid.RowDetailsTemplate est plus approprie pour ce cas car il accepte un itemscontrol ce qui permet de fourguer un treeview equipe de son Hierachical DataTemplate....dans la colonne souhaite ou sera seulement un champ de la liste principale..
code exemple behind.cs du class data exemple (liste de liste herarchique):

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
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Collections.ObjectModel;
 
namespace WpfTreeViewInDGV
{
    public class ClassC
    {
        public ClassC(string s)
        {
            ID = s;
        }
        public string ID { get; set; }
 
    }
    //ce class necessite un datatemplate specifique
    //car il a un champ en plus 
    public class ClassB
    {
        public ClassB(string s,int n)
        {
            ID = s;
            Numero = n;
            Liste = new ObservableCollection<ClassC>();
        }
        public string ID { get; set; }
        public int Numero { get; set; }
        public ObservableCollection<ClassC> Liste { get; set; }
    }
    public class ClassA
    {
        public ClassA(string s)
        {
            ID = s;
            Liste = new ObservableCollection<ClassB>();
        }
        public string ID { get; set; }
        public ObservableCollection<ClassB> Liste { get; set; }
    }
 
    public class ListeDesListes : ObservableCollection<ClassA> 
    {
        private ClassC cl;
        private ClassB bl;
        private ClassA al;
        public ListeDesListes()
        { 
            for (int i = 0; i < 5; i++)
            {
                al = new ClassA("A"+i.ToString());
                for (int j = 0; j < 6; j++)
                {
                    bl = new ClassB ("B"+j.ToString(),(j+1)*10);
                    for (int k = 0; k < 4; k++)
                    {
                        cl = new ClassC("C" + j.ToString());
                        bl.Liste.Add(cl);
                    }
                    al.Liste.Add(bl);
                }
                this.Add(al);
            }
 
        }
    }
 
}

code xaml du winform utilisateur:

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<Window x:Class="WpfTreeViewInDGV.WinRowDetailsTreeView"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:local="clr-namespace:WpfTreeViewInDGV"
        Title="WinRowDetailsTreeView" Height="300" Width="300">
    <Window.Resources>
        <local:ListeDesListes x:Key="l"></local:ListeDesListes>
        <!--expand the  TreeViewItem-->
        <Style TargetType="TreeViewItem">
            <Setter Property="IsExpanded" Value="True"/>
        </Style>
        <HierarchicalDataTemplate 
                x:Key="treeviewTemplate"
                ItemsSource ="{Binding Path=Liste}">
            <StackPanel Orientation="Horizontal" >
                <TextBlock Background="Red" Foreground="White"  Margin="5" Text="{Binding Path=ID}"/>
                <TextBlock Background="Yellow" Foreground="Blue"  Margin="5" Text="{Binding Path=Numero}"/>
            </StackPanel>
        </HierarchicalDataTemplate>
 
    </Window.Resources>
    <Grid>
        <DataGrid ItemsSource="{Binding Source={StaticResource l}}" 
                  AutoGenerateColumns="True" 
                  RowDetailsVisibilityMode="VisibleWhenSelected">
 
            <DataGrid.RowDetailsTemplate>
                <DataTemplate>
                    <TreeView  
                        ItemsSource="{Binding Liste}" 
                        ItemTemplate="{StaticResource treeviewTemplate}">
                    </TreeView>
                    <!--en general un itemscontrol:listbox,combobox,listview et...-->
                    <!--<ItemsControl
                        ItemsSource="{Binding taPropListe}" 
                        ItemTemplate="{StaticResource tonTemplate}" />-->
                </DataTemplate>
            </DataGrid.RowDetailsTemplate>
        </DataGrid> 
    </Grid>
</Window>

Bon code...

Merci pour votre aide,

Est il un moyen d'utiliser uniquement du XAML ?