CODEWITHSUNDEEP
.netvb.netwinformsgraphicsgdi+
ElektroStudios
ElektroStudios

Reputation: 20464

Draw image into shape?

I've made an user control that can be used as a circle/square/triangle shape, the control can draw a border (outer) and fill what its inside that border (inner)

To understand it:

enter image description here

The border is the black, and the inner is the red.

Well, now I would like to add a feature in my control to fill the inner of the shape using an image.

but when I try to fill only that space using an image, the outside area of the shape is also drawn:

enter image description here

I'm not any expert using GDI+, how I can fix this?

I need to do this with a circle, an square and a triangle, I don't know if that could be an stop thing.

This is the code that I'm using to fill the circle with an image:

Public Property InnerImage As Image = Image.FromFile("C:\random.jpg")

''' <summary>
''' Draws a circle on the specified <see cref="System.Drawing.Graphics"/> object.
''' </summary>
''' <param name="g">The <see cref="System.Drawing.Graphics"/> object to draw.</param>
Private Sub DrawCircle(ByRef g As Graphics)

    With g

        Using pen As New Pen(Me._BorderColor, Me._BorderWidth)

            Dim rect As Rectangle = Me.GetFigueRectangle(pen)

            ' Fill the circle using the image.
            If Me.InnerImage IsNot Nothing Then
                .DrawImage(Me.InnerImage, rect)

            Else ' Fill the circle using a solid colour.
                If Not Me._InnerColor = Color.Transparent Then

                    Using brush As New SolidBrush(Me._InnerColor)
                        .FillEllipse(brush, rect)
                    End Using

                End If ' Not Me._InnerColor = Color.Transparent

            End If

            ' Draw the circle border.
            .DrawEllipse(pen, rect)

        End Using ' pen As New Pen(Me._BorderColor, Me._BorderWidth)

    End With ' g

End Sub

And GetFigueRectangle function (which a use it for both Circle, Square and Triangle) is this:

''' <summary>
''' Gets a <see cref="System.Drawing.Rectangle"/> with the bounds fixed according to the specified <see cref="System.Drawing.Pen.Width"/>.
''' </summary>
''' <param name="pen">The <see cref="System.Drawing.Pen"/>.</param>
''' <returns>The <see cref="System.Drawing.Rectangle"/> with the bounds fixed.</returns>
Private Function GetFigueRectangle(ByVal pen As Pen) As Rectangle

    Return New Rectangle With
                {
                    .x = CInt(0.0F + (pen.Width / 2.0F)),
                    .y = CInt(0.0F + (pen.Width / 2.0F)),
                    .width = CInt(MyBase.Width - pen.Width),
                    .height = CInt(MyBase.Height - pen.Width)
                }

End Function

Upvotes: 2

Views: 2990

Answers (1)

Bradley Uffner
Bradley Uffner

Reputation: 16991

You can use Graphics.SetClip that takes a GraphicsPath to set a clipping region. More info here: http://msdn.microsoft.com/en-us/library/0z994t06(v=vs.110).aspx

This will allow you to clip your drawing to any possible shape you can think of. Only pixels inside the path will actually be drawn,.

Upvotes: 4

Related Questions