Discussion :

[sisi37]

Bonjour à tous,

J'ai un petit (gros ?) problème pour effectuer un zoom sur une image.

Je dispose d'une carte de la France qui est une image IGN. Sur cette dernière, je peux effectuer des zoom grâce à un ScaleTransform.

J'affiche des points sur cette dernière qui sont des boutons cliquables et qui sont sur la même grid que l'image. Ainsi, lors d'un zoom, l'emplacement des boutons n'est pas modifié.

Cependant, ces derniers grossissent automatiquement.

Je souhaiterais savoir comment pourrais-je faire un ScaleTransform de façon à zoomer mon image, sans zoomer mes boutons, tout en faisant en sorte qu'ils restent à la même place ?

J'ai tenté de faire une méthode qui passe en revu l'ensemble des points de ma carte, et qui réduit ou augmente leur taille. Cependant, celle-ci demande énormément de ressources.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
// value = niveau de zoom actuel
if (value > 5) {
     foreach (UIElement uie in france_entiere.Children)
           {
           if (uie is Button)
                    {
                     Button child = uie as Button;
                     child.Width = child.Width - 3;
                     child.Height = child.Height - 3;
            }
      }
}

Quelqu'un a-t-il déjà eu le même problème que moi ? Avez-vous des idées ?

Merci par avance et bonne rentrée pour ceux qui étaient en vacances

[ikeas]

il y a une solution simple ... si j'ai bien tout compris
tu colle ton image dans une grid
tu ne zoom pas l'image avec le scale transforme mais tu change la taille
height et width de la grille en faisant ton calcul (si l'image est strech de partout elle va s'agrandir)
les bouton qui sont dans la grid dispose de margin
si la grid augment
les boutons vont se déplacer naturellement en fonction de leurs margin

[sisi37]

Bonjour Ikeas,
Tout d'abord, merci d'avoir pris le temps de me répondre.

J'ai essayé ta solution, qui effectivement aurait dû logiquement fonctionner.

J'ai donc le code XAML suivant :

Code :

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

1
2
3
4
5
6
 
    <Grid x:Name="france_entiere" Width="600" Height="549.4">
        <Image x:Name="image_france" Stretch="UniformToFill" Source="/test_zoom_map;component/Images/test_img_france%20-%20Copie_sinc_6000_90.jpg">
        </Image>
        <Button Content="Button" Click="button1_Click" Margin="287,128,285,398" Name="button1" />
    </Grid>

Cependant, lorsque je modifie les dimensions de la grid, le bouton grossi lui-aussi.

J'ai tenté de mettre un MaxWidth et un MaxHeight, mais dans ce cas le bouton se décale à chaque clic fois que la grid est redimensionnée.


En attendant de trouver mieux, je vais voir pour ne redimensionner que mes contrôles visibles afin de voir la consommation de ressources.

[ikeas]

ca marcherais mieux avec un docking top left et pas de margin right bottom je pense