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"/>