Discussion :

[Kropernic]

Hello,

Dans une fenêtre, j'utilise le code xaml ci-dessous :

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
            <MenuItem x:Name="miImport" Click="miImport_Click">
                <MenuItem.Header>
                    <TextBlock x:Name="tbImport" Text="Import" VerticalAlignment="Center" Height="16"/>
                </MenuItem.Header>
                <MenuItem.Icon>
                    <Image Margin="0,4,0,4" Source="pack://siteoforigin:,,,/Resources/import.png" Height="{Binding ElementName=miImport, Path=ActualHeight-8}"/>
                </MenuItem.Icon>
            </MenuItem>
            <MenuItem x:Name="miReport" Click="miReport_Click">
                <MenuItem.Header>
                    <TextBlock x:Name="tbReport" Text="Report" VerticalAlignment="Center"/>
                </MenuItem.Header>
                <MenuItem.Icon>
                    <Image Margin="0,4,0,4" Source="pack://siteoforigin:,,,/Resources/diagram.ico" Height="{Binding ElementName=miReport, Path=ActualHeight-8}"/>
                </MenuItem.Icon>
            </MenuItem>
            <MenuItem x:Name="miOrders" Click="miOrders_Click">
                <MenuItem.Header>
                    <TextBlock x:Name="tbOrders" Text="Orders" VerticalAlignment="Center"/>
                </MenuItem.Header>
                <MenuItem.Icon>
                    <Image Margin="0,4,0,4" Source="pack://siteoforigin:,,,/Resources/buy.ico"/>
                </MenuItem.Icon>
            </MenuItem>

Les lignes importantes sont les lignes avec les composants <Image/>. Ces images, je leur des marges, une source et une hauteur (pour la largeur, les propriétés Stretch et StretchDirection étant respectivement par défaut sur Uniform et Both, cela ne devrait pas être la peine de définir quelque chose).

Sous Win7, tout va bien. l'image occupe bien toute la hauteur du MenuItem moins 8 pixels.
Sous Win8.1 Pro par contre (aussi bien sur desktop que sur tablette), l'image s'affiche de manière tellement petite qu'on distingue à peine de quoi il s'agit.

J'ai pensé au facteur de grossissement (qui m'a déjà joué des tours récemment) mais je ne pense pas que le problème vienne de là vu qu'il est à 100% sur desktop et 150% sur tablette (par défaut). Or, sur l'un comme sur l'autre, l'affichage de mon image est le même. C'est minuscule. On voit bien que la place disponible n'est pas utilisée (vu le binding sur la propriété Height, cela devrait pourtant être le cas). L'image est même plus petite que le texte affiché par le composant TextBlock contenu dans MenuItem.Header.

Manque-t-il quelque chose à mon code xaml pour que la taille de l'image puisse s'ajuster correctement ?

Ci-joint, comment le menu s'affiche sur une Surface Pro 3 avec facteur de grossissement sur 150%. On voit bien ici que l'image dans le 3e MenuItem, sur laquelle je n'ai pas défini de hauteur, s'affiche de la même manière que les deux autres. Comme si ce binding ne produisait aucun effet...


EDIT : Je me demande à l'instant si ce n'est pas le "-8" dans le binding qui pose problème... je vais tester en l'enlevant pour voir.
EDIT 2 : Cela semble être le problème. Reste à trouver comment prendre en compte les marges tout en lui disant de prendre toute la hauteur disponible... Pas trop envie d'aller inclure un DockPanel dans ce bordel XD
EDIT 3 : Pour ce coup-ci, vu que la taille du MenuItem ne varie pas, j'ai retiré la propriété Margin des images et j'ai fixé leur taille à 27 (qui est la valeur qui aurait résulté du calcul que je tentais d'appliquer dans le binding). Cela me donne quelque chose d'acceptable sur win8 mais clairement, y a encore de la place... C'est dommage. (voir nouveau screen ci-dessous).