Animation flip PictureBox ou Label horizontalement avec Click

Version imprimable

Bonjour,
Je souhaite créer une animation qui se déclenche au clic et réalise un effet de retournement horizontal sur le Label1. Initialement, le texte de Label1 est défini sur "►", et je veux que chaque clic change la direction de la flèche, comme le montre la vidéo que j'ai jointe. Cependant, j'ai rencontré un problème avec le code actuel : le Label effectue une rotation de 90 degrés et disparaît.

la vidéo : https://drive.google.com/file/d/10uz...ew?usp=sharing

Code:

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
Private RotationAngle As Double = 0
Private RotationSpeed As Double = 20 ' Vitesse de rotation (ajustez cette valeur pour contrôler la vitesse)
Private IsRotating As Boolean = False ' Indicateur de rotation en cours
Private Sub InitializeRotationTimer()
    Timer1.Interval = 50 ' Réglez l'intervalle du timer pour contrôler la vitesse (50ms pour cet exemple)
End Sub
Private Sub Timer1_Tick(sender As Object, e As EventArgs) Handles Timer1.Tick
    Const MaxRotationAngle As Double = 360 ' Réglez la valeur maximale à 360 pour une rotation complète
    If IsRotating Then
        RotationAngle += RotationSpeed
        If RotationAngle >= MaxRotationAngle Then
            RotationAngle = MaxRotationAngle ' Assurez-vous que l'angle ne dépasse pas 360 degrés
        End If
        Dim lCenterX As Long = Label1.Width / 2 + Label1.Left
        Dim lWidth As Long = Label1.Width
        ' Assurez-vous que la largeur ne devienne pas nulle
        Dim newWidth As Long = lWidth * Math.Abs(Math.Cos(RotationAngle * (Math.PI / 180)))
        'If newWidth > 0 Then
        System.Windows.Forms.Application.DoEvents()
        Label1.Width = newWidth
        Label1.Left = lCenterX - Label1.Width / 2
        'End If
    End If
End Sub
Private Sub Label1_Click(sender As Object, e As EventArgs) Handles Label1.Click
    If Not IsRotating Then
        IsRotating = True ' Démarrez la rotation si elle n'est pas déjà en cours
        InitializeRotationTimer()
        Timer1.Start()
    Else
        IsRotating = False ' Arrêtez la rotation si elle est déjà en cours
        Timer1.Stop()
    End If
End Sub

Auriez-vous des conseils ou des suggestions pour résoudre ce problème ? Je vous remercie par avance pour votre aide !

Salut

Peut être ta ligne 21

Code:

1
2
        'Label1.Left = lCenterX - Label1.Width / 2
        Label1.Left = lCenterX - (Label1.Width / 2)

05/10/2023, 19h03
Phil Rob

J'ai sûrement rien compris....
Mais quand même, ne serait-ce pas plus facile de remplacer la flèche du Label par l'autre flèche ?
... plutôt que de s'évertuer à retourner ce Label.
...8O
05/10/2023, 19h46
umfred

J'ai testé ton code et chez moi, 0 rotation, juste une réduction de la largeur du Label, qui est en relation avec les commentaires du code indiquant de vérifier que la largeur ne devienne pas nulle (0*x =0) auquel cas, le Label disparait.
Et il y a aussi un problème d'arrêt du timer: la seule condition d'arrêt du timer est de recliquer sur le label.
PS: tu as oublié de préciser qu'il faut mettre Autosize sur False, sinon il ne se passe absolument rien.

Pour ta vidéo, je pense que c'est un gif qui est utilisé composé des différentes étapes de la rotation, et on affiche tour à tour chacune des images composant le mouvement. La version "cheap" c'est de remplacer le texte par la flèche contraire , comme l'a évoqué Phil Rob

Merci Phil Rob pour votre suggestion. Vous avez raison, remplacer la flèche par l'autre flèche pourrait être une solution plus simple pour résoudre ce problème. En fait, c’était la première solution à laquelle j’ai pensé. Cependant, je recherche un effet visuel spécifique en retournant le Label. Cet effet ajoutera une touche unique à l'interface utilisateur.

Merci ProgElecT pour votre réponse et pour la remarque. J'ai effectué une vérification, mais le problème ne semble pas être lié à cela.

Merci umfred également pour votre réponse. J’ai changé le label par un PictureBox avec deux images de flèches png (Right et Left, l'image par défaut est Right). Voici le nouveau code pour simuler une rotation horizontale (enfin, pas tout à fait une rotation conventionnelle!). Jusqu’à présent, ça fonctionne, mais il me reste à trouver une solution pour contrôler la vitesse de rotation.
Code:

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 Private currentImage As Image = Nothing Private isImage1Displayed As Boolean = True Private Sub PictureBox1_Click(sender As Object, e As EventArgs) Handles PictureBox1.Click Dim lCenterX As Long Dim lWidth As Long Dim l As Long With ConvDir lCenterX = .Width / 2 + .Left lWidth = .Width .Visible = True For l = 0 To lWidth .Width = l .Left = lCenterX - .Width / 2 System.Windows.Forms.Application.DoEvents() Next l .Width = lWidth .Left = lCenterX - .Width / 2 End With If isImage1Displayed Then ' Si img1 est actuellement affichée, affichez img2 PictureBox1.Image = Image.FromFile("Source_de_l'image_left.png") Else ' Sinon, affichez img1 PictureBox1.Image = Image.FromFile("Source_de_l'image_right.png") End If ' Inversez la valeur de l'indicateur isImage1Displayed = Not isImage1Displayed End Sub

c'est quoi ConvDir dans ton code ?
j'utiliserais un timer qui me calculerai la nouvelle position à chaque tick jusqu'à l'image finale

Un retournement basique
Code:

1 2 3 4 5 Private Sub Button1_Click(sender As Object, e As EventArgs) Handles Button1.Click Dim rotateimage As Image = New Bitmap(PictureBox1.Image) rotateimage.RotateFlip(RotateFlipType.RotateNoneFlipX) PictureBox1.Image = rotateimage End Sub

Désolé, "ConvDir" c’est "PictureBox1" dans mon code. Votre code est efficace pour effectuer un effet de miroir horizontal (flip - retournement), mais il ne réalise pas de rotation. Avec quelques modifications, j'ai pu créer une rotation verticale complète de 360 degrés !

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
Private rotationStep As Integer = 0
 
Private Sub PictureBox1_Click(sender As Object, e As EventArgs) Handles PictureBox1.Click
    rotationStep = 0
    Timer1.Start() ' Timer1.Interval = 500
End Sub
 
Private Sub Timer1_Tick(sender As Object, e As EventArgs) Handles Timer1.Tick
    If rotationStep < 4
        Dim rotateimage As Image = New Bitmap(PictureBox1.Image)
        rotateimage.RotateFlip(RotateFlipType.Rotate90FlipNone)
        PictureBox1.Image = rotateimage
        rotationStep += 1
    Else
        Timer1.Stop()
    End If
End Sub