Discussion :

[Takumi]

Bonjour,

Avançant tranquillement dans mon application je souhaite lui ajouter une autre petite fonctionnalité. Je dispose dans mon application d'une ListBox, et j'aurais souhaité que lors du survol d'un objet une tooltip apparaisse. Cette tooltip serait personnalisé à l'aide d'un DataTemplate et il aurait fallu pouvoir faire un binding sur l'item survolé de la ListBox car cette tooltip permettrait d'afficher plus d'information concernant l'item survolé (les items de ma ListBox sont des classes).

J'ai fait quelques recherches, consulté msdn concernant les ListBox et ListBoxItem. Mais je n'ai rien trouvé qui permette de renvoyer l'objet survolé, j'ai cherché sur google avec les terme "highlighted item listbox" mais je n'ai rien trouvé.

• Est-il possible de récupérer l'item survolé par la souris?
• Sinon je souhaite aussi pouvoir placer ma tooltip à un endroit particulier par exemple sur le côté gauche de ma ListBox et à hauteur de l'item survolé. Est-ce possible de faire cela avec les outils donnés ou bien doit-je bidouiller beaucoup (en devant passé par un custom control par exemple)?

Je vous remercie d'avance pour votre aide et votre patience.

[Samuel Blanchard]

Bonjour Takumi,

Tu pourrais gérer ca directement dans ton DataTemplate au lieu de passer par les evenements ListBox.

[Takumi]

Bonsoir,

Merci pour ta réponse. Pourrais-tu m'aiguiller un petit plus sur la manière dont je peut faire ça dans mon DataTemplate.

Edit: Est-ce que je peux réaliser cela à l'aide des Triggers dans mon DataTemplate? Si c'est ce le cas là question que je me pose c'est comment savoir quand un item est survolé, et juste un pas les items en général. Car chacun à des informations différentes.

Merci d'avance.

[Samuel Blanchard]

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal" ToolTipService.Placement="Right">                        

                        <ToolTipService.ToolTip>
                            <ToolTip Content="{Binding DataToolTip}" />
                        </ToolTipService.ToolTip>

                        <Image Source="{Binding DataImage}"/>
                        <TextBox IsReadOnly="True" Text="{Binding DataString, Mode=OneWay}"></TextBox>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>

Voila, j'espère que cela te donnera une idée plus précise.

[Takumi]

Bonsoir,

Merci j'avais pas du tout penser à ça. Par contre maintenant je bloque sur autre chose. J'ai donc crée un DataTemplate pour ma tooltip et il y a des éléments dedans pour lesquels j'aimerais les lier à la même source de donner que l'item survolé par la souris. J'ai essayé lors de mon binding de remonter jusqu'à différent élement parent mais il ne trouve pas le DataContext. Donc ma question est où se trouve le DataContext d'un ListBoxItem dans son arborescence.

[Samuel Blanchard]

Takumi,

Peux-tu nous fournir un exemple de ton datatemplate et des données bindées ?

[Takumi]

Bonsoir,

Mon DataTemplate est assez simple, je voulais juste d'abord faire des test justement pour voir si mon Binding marcherais. Pour infos complémentaire la source de donnée de ma ListBox provient d'une ObservableCollection et je fait la liaison du côté du C# tel quel:

Code :

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

1
2
 
listUser.ItemSource = UserCollection;

Voici aussi le DataTemplate de mes ListBoxItem:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
<DataTemplate x:Key="listboxItemTemplate">
        <StackPanel Background="Transparent" Margin="4" Orientation="Horizontal">
            <ToolTipService.ToolTip>
                <ToolTip Style="{StaticResource toolTipUserStyle}" ContentTemplate="{StaticResource toolTipUserTemplate}"></ToolTip>
            </ToolTipService.ToolTip>
            <ToolTipService.InitialShowDelay>2000</ToolTipService.InitialShowDelay>
            <ToolTipService.Placement>Left</ToolTipService.Placement>
            <Image Source="{Binding Path=Status, Converter={StaticResource UserStateToImageConvert}}" Margin="0 0 4 0"></Image>
            <TextBlock Text="{Binding Path=Username}" VerticalAlignment="Center"></TextBlock>
        </StackPanel>
    </DataTemplate>

Et le DataTemplate de ma ToolTip associé:

Code :

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

1
2
3
4
5
<DataTemplate x:Key="toolTipUserTemplate">
        <Border Background="White" BorderBrush="#999999" BorderThickness="1">
            <TextBlock Text="{Binding Path=Username}"></TextBlock>
        </Border>
    </DataTemplate>

Le Binding dans le DataTemplate n'est pas bon et justement c'est cela que je cherche à trouver, comment récupèrer dans mon cas le Username sachant que mon ListBoxItem lui arrive à y accéder. Je n'arrive pas à me lier à la bonne source de donnée.

Je te remercie d'avance pour ton aide.

[Samuel Blanchard]

Takumi,

si tu utilises un ContentTemplate dans ton ToolTip il te faut un Content donc :

Code :

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

1
2
3
4
<ToolTipService.ToolTip>
                <ToolTip Content="{Binding}" Style="{StaticResource toolTipUserStyle}" ContentTemplate="{StaticResource toolTipUserTemplate}"></ToolTip>
            </ToolTipService.ToolTip>

[Takumi]

Bonsoir,

Merci pour ta réponse, cela a commencé à m'aider. En faite il se trouve que je rencontre un problème. En faite il se trouve que quand je survole un élément qui n'est pas cliqué le Binding fonctionne bien. Mais à partir du moment où je séléctionne la première ligne, le Binding ne marche plus, et cela seulement sur la première ligne de ma ListBox. Chose encore plus étrangère j'ai essayé d'ouvrir 3 clients en même temps (c'est une application de tchat), et quand il y a 3 clients de connecté il se trouve que l'un d'eux, le dernier qui c'est connecté n'a pas ce problème du tous. C'est vraiment bizarre.

[Samuel Blanchard]

Les données liés à ta listbox sont-elle correctent quand tu rencontres ce problème ?

[Takumi]

Bonsoir,

Oui mes données sont correctes. Ma source de donnée comme j'ai du peut être le dire est une ObservableCollection qui contient toujours les même type d'objet. Et j'arrive en temps normal à les utiliser de façon correcte et sans que celle-ci soit "étrange". Quand tu dits correcte tu entends quoi par là?

[Samuel Blanchard]

Quand tu dits correcte tu entends quoi par là

Qu'elles correspondent aux données que tu devrais avoir. A mon avis, ne cherche pas trop du coté du Binding, la solution semble se trouver du coté de ton ObservableCollection ou de ses objets.

Les objets de ta collection sont-ils des INotifyPropertyChanged ?
Peux-tu nous montrer les classes de ces objets et la manière dont tu les ajoutes ?

[Takumi]

Bonsoir,

Oui les classes que contient mon ObservableCollection sont des INotifyPropertyChanged. Voici la classe que contient ma collection:

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
public class User : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;
 
        private State _Status;
        private String _Username;
 
        [DataMember]
        public string Username 
        {
            get { return  this._Username; }
            set
            {
                this._Username = value;
                OnPropertyChanged("Username");
            }
        }
 
        [DataMember]
        public State Status 
        {
            get { return this._Status; }
            set 
            {
                this._Status = value;
                OnPropertyChanged("Status");
            }
        }
 
        public override string ToString()
        {
            return this.Username;
        }
 
        private void OnPropertyChanged(string PropertyName)
        {
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs(PropertyName));
        }
    }

Cette classe me permet de garder des infos (basique encore) sur un utilisateur.......Oui je sais User c'est évident... Mon application est un tchat et donc ce problème que j'ai depuis le début se situe sur l'application client. J'ai aussi une application serveur et c'est là le point de départ si on peut dire ça comme ça du remplissage de ma ObservableCollection côté client. En faite quand un utilisateur se connecte, le serveur lui au fur et à mesure des connexions/déconnexions va gêrer une collection d'utilisateur, List<User>. Donc quand un client se connecte, cette liste lui est envoyé et pour remplir ma ObservableCollection j'utilise un des constructeurs qui accepte en paramètre une List. Voila, j'espère que ça pourras t'aider à mieux m'aider .

Merci d'avance

[Takumi]

Bonjour,
Je voulais savoir si tu avais une idée du problème et ce que je doit mettre en place pour le régler.

Je te remercie d'avance pour ton aide.