Discussion :

[tscrosh]

Bonjour à tous
J'aimerai dans une fenêtre mettre une image A qui représente un objet précis, sur cette image j'aimerai placer cette même image découpé en plusieurs parties, chaque partie sera visible ou non en fonction de différents arguments. Objectif est de "colorer" une zone de cette image par exemple en rouge au lieu de la couleur originale. Jusque là pas trop de souci.
Mon hic est que au dessus de tout ça j'aimerai placer une zone (image/panel) ou tout autre élément qui permet de dessiner (.DrawImage) afin de placer des points aux endroits où je clique. J'ai essayé avec Panel et avec Image par contre je n'arrive pas à rendre entièrement transparent cet objet pour voir l'arrière plan, donc mes 2 images initiales.

But recherché, imaginez une image d'un corps, vous cliquez sur un doigt, la main devient rouge et une cible est affichée sur le doigt.
Une idée comment rendre ce dernier objet transparent ?

Merci

[Phil Rob]

Bonjour,

Deux pistes ...

Les propriétés OPACITY et TRANSPARENCYKEY concernent les Form.

Première suggestion : Créer un UserControl qui soit un Form sans bord et dont la propriété Opacity est réglée comme il te plait. Tu utiliserais ce UserControl à la place du Panel.
Deuxième suggestion : Donner une couleur au Panel qui soit en rapport avec la propriété TranparencyKey du Form, de sorte à obtenir la transparence totale.

Ci-joint, une note concernant ces 2 propriétés : Transparence.pdf

J'espère que cela t'aidera ...

[MABROUKI]

Bonjour
Pour peindre sur un objet transparent le bitmap est ton ami.
1/ Point capital de GDI N° 1: il crée un nouveau bitmap avec le Size spécifié par tes soins comme transparent par défaut.
Tu dessineras tes points (une petite ellipse ) sur ce bitmap.

2/ Tu dessineras (pic.Paint)ensuite ce bitmap sur le control PictureBox (je présume) qui héberge ton image par sa prop Image.


3/ Point capital de GDI N° 2: le dessin sur le PictureBox n’altère pas l'image dans sa prop Image.

Le véritable problème c'est d'ajuster ou aligner ton image et ton bitmap de dessin Ça se fera en spécifiant des tailles identiques pour les superposer exactement .


code exemple qui illustre cela:

Code :

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
59
60
61
62
63
64
65
66
67
 
Public Class Form1
 
    Private Pic As New PictureBox
    Private LayerDrawing As Bitmap = Nothing
    Private points As New List(Of Point)
    Public Sub New()
 
        ' Cet appel est requis par le concepteur.
        InitializeComponent()
 
        ' Ajoutez une initialisation quelconque après l'appel InitializeComponent().
 
 
        Pic.Location = New System.Drawing.Point(40, 60)
        Pic.Name = "PictureBox1"
        Pic.Size = New System.Drawing.Size(500, 500)
        AddHandler Pic.Paint, AddressOf PicPaint
        AddHandler Pic.MouseDown, AddressOf PicDown
        AddHandler Pic.MouseUp, AddressOf PicUp
 
        Me.Controls.Add(Pic)
    End Sub
 
    Private Sub Form1_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
        Dim tonImage As Bitmap = New Bitmap(My.Resources.GUY, Pic.Width, Pic.Height) 'ajuste l'image
        Pic.Image = tonImage
        LayerDrawing = New Bitmap(Pic.Width, Pic.Height) 'GDI cree un bitmap transparent par defaut & ajuste
    End Sub
    Private Sub PicDown(sender As Object, e As MouseEventArgs)
        If e.Button = Windows.Forms.MouseButtons.Left Then
            Pic.Cursor = Cursors.Cross
            points.Add(e.Location)
            DrawIntoLayer() 'paint dans le bitmap LayerDrawing
            Pic.Invalidate() 'paint dans le picbox le bitmap LayerDrawing
        End If
    End Sub
    Private Sub PicUp(sender As Object, e As MouseEventArgs)
        If e.Button = Windows.Forms.MouseButtons.Right Then
            Pic.Cursor = Cursors.Default
        End If
    End Sub
    Private Sub DrawIntoLayer()
        Dim radiusPoint As Integer = 5
        Using grLayer As Graphics = Graphics.FromImage(LayerDrawing)
            grLayer.SmoothingMode = Drawing2D.SmoothingMode.HighQuality
            grLayer.Clear(Color.Transparent)
            For Each pt In points
                Dim square As New Rectangle(pt.X - radiusPoint, pt.Y - radiusPoint, radiusPoint * 2, radiusPoint * 2)
                grLayer.FillEllipse(Brushes.AliceBlue, square)
                grLayer.DrawEllipse(Pens.Red, square)
            Next
 
        End Using
 
    End Sub
    Private Sub PicPaint(sender As Object, e As PaintEventArgs)
        If LayerDrawing Is Nothing Then Return
        Dim gr As Graphics = e.Graphics
        gr.DrawImage(LayerDrawing, 0, 0)
    End Sub
 
 
 
 
 
End Class

bon code...

[tscrosh]

Merci @Phil Rob, @MABROUKI pour vos informations
J'en ai pris note et je continue mes essais.
J'ai quand même une petite question

Ici j'ai fait un Panel1 avec une image de fond (en gris), dans lequel je mets une boite image Picturebox4 avec une partie de cette image en rouge, et au dessus je mets une Picturebox2 vide (transparente).
Si je place donc cette picturebox2 au dessus des 2 autres éléments je vois l'image de fond de mon panel, mais pas la picturebox4 qui devrait être entre les 2 ...
J'ai joué avec DocumentOutline en essayant de déplacer ces éléments mais cela ne me donne pas le résultat attendu.

Je ne comprends pas la logique pourquoi la picturebox2 étant vide/transparente elle me montre juste l'image de fond du panel et non pas les 2 images en dessous d'elle.

[MABROUKI]

Merci @Phil Rob, @MABROUKI pour vos informations
J'ai quand même une petite question
Je ne comprends pas la logique pourquoi la picturebox2 étant vide/transparente elle me montre juste l'image de fond du panel et non pas les 2 images en dessous d'elle.

Alas ,la logique est que les controls Winforms ne supportent pas la transparence,autrement dit ne sont pas transparent.
Tu es victime d'une illusion d'optique ,en fait tu vois la couleur d’arrière plan du parent du Picturebox2 c.à.d la couleur d’arrière-plan du Panel.
Pour t'en convaincre ,enlève ton image ,remplace le Backolor du panel par Color.Magenta.
Pour circonvenir ce problème ,au lieu d'un ordinaire Picturebox2 il faut se doter d'un custom control supportant la transparence alias TransparentControl dont le projet bibliotheque suit.
Ce control est une usine à gaz qui surveille sa prop BackColor ou sa prop FillColor pour le rendre transparent comme l'eau minerale vittel.

code .vb du projet lib du TransparentControl :

Code :

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
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
 
 
Public Class TransparentControl
    Inherits Control
    Private borderColor As Color = Color.Black
    'Public drag As Boolean = False
    Public enab As Boolean = False
    Private alpha As Integer
    Private mdrag As Boolean = False
    Public Property Drag() As Boolean
        Get
            Return mdrag
        End Get
        Set(ByVal value As Boolean)
            mdrag = value
            If (Me.Parent IsNot Nothing) Then
                Me.Parent.Invalidate(Me.Bounds, True)
            End If
        End Set
    End Property
    Private mfillColor As Color = Color.White
    Public Property FillColor() As Color
        Get
            Return mfillColor
        End Get
        Set(ByVal value As Color)
            mfillColor = value
            If (Me.Parent IsNot Nothing) Then
                Me.Parent.Invalidate(Me.Bounds, True)
            End If
        End Set
    End Property
    Private mopacity As Integer = 100
    Public Property Opacity() As Integer
        Get
            If (mopacity > 100) Then
                mopacity = 100
            ElseIf mopacity < 1 Then
                mopacity = 1
            End If
            Return mopacity
        End Get
        Set(ByVal value As Integer)
            mopacity = value
            Me.Invalidate(Me.Bounds, True)
        End Set
    End Property
    Private mborderstyle As BorderStyle
    Public Property BorderStyle() As BorderStyle
        Get
            Return mborderstyle
        End Get
        Set(ByVal value As BorderStyle)
            mborderstyle = value
            If (Me.Parent IsNot Nothing) Then
                Me.Parent.Invalidate(Me.Bounds, True)
            End If
        End Set
    End Property
    Public Sub New()
 
        ' Cet appel est requis par le concepteur.
        InitializeComponent()
 
        SetStyle(ControlStyles.SupportsTransparentBackColor, True)
        SetStyle(ControlStyles.Opaque, True)
        Me.BackColor = Color.Transparent
        Me.BorderStyle = BorderStyle.FixedSingle
 
    End Sub
    Protected Overrides ReadOnly Property CreateParams As System.Windows.Forms.CreateParams
        Get
            Dim cp As CreateParams = MyBase.CreateParams
            cp.ExStyle = cp.ExStyle Or &H20
            Return cp
        End Get
    End Property
    Protected Overrides Sub OnPaint(ByVal e As System.Windows.Forms.PaintEventArgs)
 
 
        Dim gr As Graphics = e.Graphics
        Dim bounds As Rectangle = New Rectangle(0, 0, Me.Width - 1, Me.Height - 1)
        If Me.BorderStyle = BorderStyle.FixedSingle Then
            Using p As New Pen(borderColor)
                gr.DrawRectangle(p, New Rectangle(0, 0, Width - 1, Height - 1))
            End Using
        End If
 
        Dim frmColor As Color = Me.Parent.BackColor
        Dim brushColor As Brush
        Dim bckColor As Brush
 
        alpha = CInt((Opacity * 255) / 100)
 
        If Drag Then
            Dim dragFillColor As Color
            Dim dragBckColor As Color
 
            If (BackColor <> color.Transparent) Then
                Dim Rb As Integer = BackColor.R * alpha / 255 + frmColor.R * (255 - alpha) / 255
                Dim Gb As Integer = BackColor.G * alpha / 255 + frmColor.G * (255 - alpha) / 255
                Dim Bb As Integer = BackColor.B * alpha / 255 + frmColor.B * (255 - alpha) / 255
                dragBckColor = color.FromArgb(Rb, Gb, Bb)
            Else
                dragBckColor = frmColor
            End If
            If (FillColor <> color.Transparent) Then
                Dim Rf As Integer = FillColor.R * alpha / 255 + frmColor.R * (255 - alpha) / 255
                Dim Gf As Integer = FillColor.G * alpha / 255 + frmColor.G * (255 - alpha) / 255
                Dim Bf As Integer = FillColor.B * alpha / 255 + frmColor.B * (255 - alpha) / 255
                dragFillColor = color.FromArgb(Rf, Gf, Bf)
            Else
                dragFillColor = dragBckColor
            End If
            alpha = 255
            brushColor = New SolidBrush(Color.FromArgb(alpha, dragFillColor))
            bckColor = New SolidBrush(Color.FromArgb(alpha, dragBckColor))
        Else
            Dim color As Color = FillColor
            brushColor = New SolidBrush(color.FromArgb(alpha, color))
            bckColor = New SolidBrush(color.FromArgb(alpha, Me.BackColor))
 
        End If
        Dim pen As New Pen(Me.ForeColor)
 
        If (Me.BackColor <> Color.Transparent Or Drag) Then 'remplit le fond avec backolor opacity du control
            gr.FillRectangle(bckColor, bounds)
 
        ElseIf (FillColor <> Color.Transparent Or Drag) Then 'remplit le fond avec FillColor opacity du control
            gr.FillRectangle(brushColor, bounds)
        Else
            gr.FillRectangle(New SolidBrush(Color.FromArgb(1, Color.White)), bounds)
        End If
        'gr.DrawEllipse(pen, bounds)
 
        pen.Dispose()
        brushColor.Dispose()
        bckColor.Dispose()
        gr.Dispose()
 
        MyBase.OnPaint(e)
    End Sub
    Protected Overrides Sub OnBackColorChanged(e As System.EventArgs)
        If Me.Parent IsNot Nothing Then Parent.Invalidate(Me.Bounds, True)
        MyBase.OnBackColorChanged(e)
    End Sub
    Protected Overrides Sub OnParentBackColorChanged(e As System.EventArgs)
        Me.Invalidate()
        MyBase.OnParentBackColorChanged(e)
    End Sub
 
 
End Class

Tu peux le tester sur le designer en droppant plusieurs controls sur ton form et en le mettant en avant plan:
si la prop Drag = true la Transparence est désactivée
si la prop Drag = false la Transparence est activée avec la valeur d’opacité actuelle pour
1/ la prop Backcolor si la prop Backcolor <> Transparent.Color
2/ la prop FillColor si la prop Backcolor= Transparent.Color


application au syndrome du picturebox2 cachottier avec le precedent code revu et plus simple cette fois ci:

Code :

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
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
 
Imports ControlLib
 
Public Class Form3
    Private Panel1 As New Panel
    Private PictureBox4 As New PictureBox 'partie d'image rouge
    Private AliasPictureBox2 As New TransparentControl
    Private points As New List(Of Point)
 
    Public Sub New()
 
        ' Cet appel est requis par le concepteur.
        InitializeComponent()
 
        ' Ajoutez une initialisation quelconque après l'appel InitializeComponent().
 
        Me.PictureBox4.Image = My.Resources.Resources.ImageRouge
        Me.PictureBox4.Location = New Point(70, 90)
        Me.PictureBox4.Name = "PictureBox4"
        Me.PictureBox4.Size = New Size(100, 120)
        Me.PictureBox4.SizeMode = PictureBoxSizeMode.StretchImage
 
        Me.AliasPictureBox2.BackColor = Color.Transparent
        Me.AliasPictureBox2.BorderStyle = BorderStyle.FixedSingle
        Me.AliasPictureBox2.Drag = False
        Me.AliasPictureBox2.FillColor = Color.Red
        Me.AliasPictureBox2.ForeColor = Color.Black
        Me.AliasPictureBox2.Location = New System.Drawing.Point(0, 0)
        Me.AliasPictureBox2.Name = "TransparentControl1"
        Me.AliasPictureBox2.Opacity = 20
        Me.AliasPictureBox2.Size = New Size(399, 349)
        Me.AliasPictureBox2.TabIndex = 1
        Me.AliasPictureBox2.Text = "TransparentControl1"
 
        AddHandler AliasPictureBox2.MouseDown, AddressOf AliasPictureBox2_MouseDown
        AddHandler AliasPictureBox2.MouseUp, AddressOf AliasPictureBox2_MouseUp
 
 
 
        Me.Panel1.BackgroundImage = My.Resources.Resources.GUY
        Me.Panel1.BackgroundImageLayout = ImageLayout.Stretch
        Me.Panel1.BorderStyle = BorderStyle.FixedSingle
        Me.Panel1.Controls.Add(Me.AliasPictureBox2)
        Me.Panel1.Controls.Add(Me.PictureBox4)
        Me.Panel1.Location = New Point(56, 36)
        Me.Panel1.Name = "Panel1"
        Me.Panel1.Size = New Size(400, 350)
        Me.Controls.Add(Me.Panel1)
    End Sub
    Private Sub AliasPictureBox2_MouseDown(sender As Object, e As System.Windows.Forms.MouseEventArgs)
        If e.Button = Windows.Forms.MouseButtons.Left Then
            AliasPictureBox2.Cursor = Cursors.Cross
            points.Add(e.Location)
            DrawIntoLayer()
        End If
    End Sub
    Private Sub AliasPictureBox2_MouseUp(sender As Object, e As System.Windows.Forms.MouseEventArgs)
        If e.Button = Windows.Forms.MouseButtons.Right Then
            AliasPictureBox2.Cursor = Cursors.Default
        End If
    End Sub
   'le dessin des points se fait directement sur la surface de AliasPictureBox2
    Private Sub DrawIntoLayer()
        Dim radiusPoint As Integer = 5
        Using grLayer As Graphics = AliasPictureBox2.CreateGraphics
            grLayer.SmoothingMode = Drawing2D.SmoothingMode.HighQuality
            For Each pt In points
                Dim square As New Rectangle(pt.X - radiusPoint, pt.Y - radiusPoint, radiusPoint * 2, radiusPoint * 2)
                grLayer.FillEllipse(Brushes.AliceBlue, square)
                grLayer.DrawEllipse(Pens.Red, square)
            Next
 
        End Using
 
    End Sub
 
 
 
 
 
End Class

bon code....