Discussion :

[Masamunai]

Bonjour

Je cherche à mettre en forme une infobulle dynamique qui apparait lors du MouseOver d'un ComboboxItem, affichant des infos détaillées.
Ces infos se trouvent dans la dernière colonne de la même BindingListCollectionView auquel la Combobox est bindée, et correspondent simplement à la concaténation des valeurs non-nulles de la DataRow correspondante.

J'ai donc dans le code behind :

Code vb.net :

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
Class MainWindow
 
    Dim MainWeapon1BindingList As BindingListCollectionView = CType(CollectionViewSource.GetDefaultView(New DataView(WeaponsList)), BindingListCollectionView)
 
    Private IsReady As Boolean = False
 
    Private Sub MainWindow_Loaded(ByVal sender As Object, ByVal e As RoutedEventArgs) Handles MyBase.Loaded
        'Chargez les données dans la table Weapon.
        Dim DataSetWeaponTableAdapter As WpfApplication1.DataSetTableAdapters.WeaponTableAdapter = New WpfApplication1.DataSetTableAdapters.WeaponTableAdapter()
        DataSetWeaponTableAdapter.Fill(WeaponsList)
 
        ' Construction de la colonne "Description" pour chacune des DataTables Equipements
        ' Chaque enregistrement de cette colonne est une String concaténant chaque champ de la DataTable avec la valeur correspondante (non vide),
        ' et servira de contenu dynamique pour une infobulle sur chaque ComboBoxItem.
        BuildDescriptions()
 
        MainWeapon1.DataContext = MainWeapon1BindingList
 
        IsReady = True
    End Sub
 
    ' Sub de remplissage de la colonne calculée "Description"
    ' Pour l'instant je ne l'ai implémentée que pour une seule Combobox, mais j'en ai d'autres qui attendent la même chose...
    Private Sub BuildDescriptions()
        WeaponsList.Columns.Add("Description")
 
        Dim Description As String
        With WeaponsList
            For Each DataRow In WeaponsList
                Description = ""
                If Not (DataRow.IsDamage_TypeNull OrElse _
                        DataRow.IsDelayNull OrElse _
                        DataRow.IsTypeNull OrElse _
                        DataRow.IsDMGNull) Then
                    Description = "[" & DataRow.Type & "] " & DataRow.Damage_Type & Chr(13)
                    Description += "DMG:" & DataRow.DMG & " Delay:" & DataRow.Delay & Chr(13)
                End If
                For i = 2 To .Columns.Count - 1 'Assuming columns are in correct order
                    If Not (IsDBNull(DataRow.Item(i)) OrElse .Columns(i).ColumnName.Equals("Names") OrElse _
                                                             .Columns(i).ColumnName.Equals("DMG") OrElse _
                                                             .Columns(i).ColumnName.Equals("Delay") OrElse _
                                                             .Columns(i).ColumnName.Equals("Type") OrElse _
                                                             .Columns(i).ColumnName.Equals("Damage Type") OrElse _
                                                             .Columns(i).ColumnName.Equals("Level") OrElse _
                                                             .Columns(i).ColumnName.Equals("Equippable Jobs") OrElse _
                                                             .Columns(i).ColumnName.Contains("Notes") OrElse _
                                                             .Columns(i).ColumnName.Equals("Rare")) Then
                        Description += .Columns(i).ColumnName & ": " & DataRow.Item(i) & " "
                    End If
                Next
                Description += Chr(13) & "Lvl" & DataRow.Level & " " & DataRow.Equippable_Jobs
                DataRow.Item("Description") = Description
            Next
        End With
    End Sub
End Class

Puis dans le code 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
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
                    <Expander Name="TPsets" Header="TP Sets" IsExpanded="True">
                        <Expander.Resources>
                            <Style TargetType="ComboBox">
                                <Setter Property="Background" Value="{x:Null}"/>
                                <Setter Property="BorderBrush" Value="{x:Null}"/>
                                <Setter Property="VerticalContentAlignment" Value="Center"/>
                                <Setter Property="Margin" Value="2"/>
                                <Setter Property="IsEditable" Value="True"/>
                                <Setter Property="StaysOpenOnEdit" Value="True"/>
                                <Setter Property="ItemsSource" Value="{Binding}"/>
                                <Setter Property="DisplayMemberPath" Value="Names"/>
                                <Setter Property="SelectedValuePath" Value="Names"/>
                                <EventSetter Event="SelectionChanged" Handler="UpdateCBXItemsSources"/>
                            </Style>
                            <Style TargetType="ComboBoxItem">
                                <Style.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter Property="ToolTip" Value="{Binding Description}"/>
                                    </Trigger>
                                </Style.Triggers>
                            </Style>
                      <!--      <Style TargetType="ToolTip">
                                <Setter Property="OverridesDefaultStyle" Value="True"/>
                                <Setter Property="Template">
                                    <Setter.Value>
                                        <ControlTemplate TargetType="ToolTip">
                                            <DockPanel>
                                                <Image DockPanel.Dock="Left"/>
                                                <TextBlock DockPanel.Dock="Top" Text="{Binding Names}" TextAlignment="Left"/>
                                                <TextBlock DockPanel.Dock="Bottom" Text="{Binding Description}" TextWrapping="Wrap"/>
                                            </DockPanel>
                                        </ControlTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style> -->
                        </Expander.Resources>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition />
                                ...
                                <RowDefinition />
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="50"/>
                                <ColumnDefinition />
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>
                            <Menu Grid.Row="0" Grid.Column="0" Margin="2" ToolTip="Edit Database or Search Filter">
                                <Menu.Background>
                                    <ImageBrush ImageSource="/FFXIMDCwpf1;component/Images/MainWeaponIcon.png" Stretch="Uniform" />
                                </Menu.Background>
                                <MenuItem Height="22" Width="44">
                                    <MenuItem Header="Edit Database" />
                                </MenuItem>
                            </Menu>
                            <ComboBox Name="MainWeapon1" Grid.Row="0" Grid.Column="1"/>
                        </Grid>
                    </Expander>

et cela donne l'aperçu en 1ère pièce jointe.

Le contenu de la Tooltip est bindé à la colonne "Description" prè-construite dans le Main_Loaded du code behind.
Le style par défaut est sympa mais bon.... j'aurait préféré y rajouter le Nom de l'item en gras dans un autre textblock docké en haut, une image dockée contre la bordure gauche de la tooltip (dont je verrai la source + tard), et une icone booléenne dans le coin supérieur droit... cf. aperçu en 2e pièce jointe.
... et tant qu'on y est, le Placement de la Tooltip, bordure gauche dockée contre la bordure droite de la liste déroulante.
Dans le code XAML ci-dessus, j'y ai mis en commentaire un "essai" de Template, mais il foire: le background de la tooltip semble devenu transparent et la police blanche (en regardant bien par-dessus la police noire des comboxitems qu'on arrive à voir cette drôle de Tooltip "invisible").

J'ai essayé d'autres syntaxes mais j'avoue je m'y perds entre DataTemplate, ContentTemplate et Tooltip.Template, etc...
Comment feriez-vous cela ?

EDIT: J'ai trouvé pour le Placement, suffisait de rajouter :

Code :

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

1
2
<Setter Property="ToolTip" Value="{Binding Description}"/>
<Setter Property="ToolTip.Placement" Value="Right"/>

[goast]

Salut

En ce qui concerne le background c'est normal qu'il soit transparent car t'as redéfini le Template du ToolTip sans mettre de background à ton DockPanel. Et pour le Foreground du text il suffit de rajouter TextBlock.Foreground="Black" au dockPanel.

[Masamunai]

Donc si je comprends bien, le fait d'écrire Overrides DefaultStyle signifie tout mettre à 0 ? (d'où le Background/Foreground et Police à NULL ?)

Ce que je souhaite c'est juste "compléter" la tooltip montrée en 1ere capture d'ecran. Autrement dit réutiliser ce qu'elle avait déjà puis rajouter des conteneurs pour mieux agencer son contenu...

Dans le cours de M. Lasserre il écrit qu'il faut utiliser Overrides DefaultStyle sinon rien ne marchera... Ou j'ai mal compris ?

Suis-je coincé et obligé de retemplater mes tooltip depuis 0 ? (tiens je vais essayer BasedOn=DefaultStyle pour voir...)

EDIT: mettre BasedOn="{StaticResource {x:Type ToolTip}}" ou supprimer le Setter OverridesDefaultStyle remet la police par défaut noire. Mais le background reste transparent...
Comment "récupérer" le Background par défaut des ToolTips de VB2010 ? en fait je veux dire carrément tout le style par défaut (car je vois qu'il y a aussi un dégradé et une ombre).

[goast]

En fait le soucis n'est pas de redéfinir le style mais redefinir le ControlTemplate. Car c'est dans le template qu'on dit que le ToolTip est un Border avec une telle couleur contenant un ContentPresenter...
Toi ce que tu essayes de faire c'est de mettre en forme le contenu du ToolTip donc c'est le contenu que tu doit formater:

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
 
<Style TargetType="ComboBoxItem">
                                <Style.Triggers>
                                    <Trigger Property="IsMouseOver" Value="True">
                                        <Setter Property="ToolTip">
                                        <Setter.Value>
                                         <DockPanel>
                                                <Image DockPanel.Dock="Left"/>
                                                <TextBlock DockPanel.Dock="Top" Text="{Binding Names}" TextAlignment="Left"/>
                                                <TextBlock DockPanel.Dock="Bottom" Text="{Binding Description}" TextWrapping="Wrap"/>
                                            </DockPanel>
                                        </Setter.Value>
                                        </Setter>
                                    </Trigger>
                                </Style.Triggers>
                            </Style>

[Masamunai]

...Toi ce que tu essayes de faire c'est de mettre en forme le contenu du ToolTip donc c'est le contenu que tu doit formater:

Code :

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

1
2
3
4
5
                                             <DockPanel>
                                                <Image DockPanel.Dock="Left"/>
                                                <TextBlock DockPanel.Dock="Top" Text="{Binding Names}" TextAlignment="Left"/>
                                                <TextBlock DockPanel.Dock="Bottom" Text="{Binding Description}" TextWrapping="Wrap"/>
                                            </DockPanel>

Si je comprends bien, je dois mettre la portion de code ci-dessus dans un <ToolTip.ContentTemplate> inséré je ne sait où ?

EDIT: je viens de tester ton code "tel quel", ca marche ! A force e chercher à tout comprendre, je pige de travers, Mea Culpa, Merci !

[goast]

Je pensais le mettre directement dans le contenu du ToolTip telle que je l'ai mis dans le post d'avant mais effectivement un ToolTip est un ContentControl donc il a un ContentTemplate. Et donc dans le style du ToolTip tu peux changer le ContentTemplate.

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
 
                            <Style TargetType="ToolTip">
                                <Setter Property="ContentTemplate">
                                    <Setter.Value>
                                        <DataTemplate>
                                            <DockPanel>
                                                <Image DockPanel.Dock="Left"/>
                                                <TextBlock DockPanel.Dock="Top" Text="{Binding Names}" TextAlignment="Left"/>
                                                <TextBlock DockPanel.Dock="Bottom" Text="{Binding Description}" TextWrapping="Wrap"/>
                                            </DockPanel>
                                        </DataTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>