Graphics - Rounded Corners & Drawing [Resolved]

[RobDog888]

Ok, I learned how to do some gradient drawing and now its time to learn how
to draw arcs. I went through the clock demo in the 101 .NET tutorial projects
but its a little advanced for me.

How do I draw an arc, more importantly rounded corners on a control?

Thanks in advance for any help.

[RobDog888]

Ok, so far I can draw the arcs where I need them, but this will not be good
unless I can clear the area to make the rounded corners. This is what I have
so far.

Protected Overrides Sub OnPaint(ByVal e As PaintEventArgs)
        'Set background to white
        e.Graphics.FillRectangle(Brushes.White, Me.ClientRectangle)
        'Create pen.
        Dim BlackPen As New Pen(Color.Black, 1)
        'Create left rectangle to bound ellipse.
        Dim rLeft As New Rectangle(0, 0, 15, 15)
        'Create start and sweep angles on ellipse.
        Dim aStartL As Single = 180.0F
        Dim aSweepL As Single = 90.0F
        'Draw left arc to screen.
        e.Graphics.DrawArc(BlackPen, rLeft, aStartL, aSweepL)
        'Duplicate for right
        Dim rRight As New Rectangle(Me.Width - 15, 0, 15, 15)
        Dim aStartR As Single = 270.0F
        Dim aSweepR As Single = 90.0F
        e.Graphics.DrawArc(BlackPen, rRight, aStartR, aSweepR)
        MyBase.OnPaint(e)
    End Sub

I think I need to do some kind of clipping on a pie area with the arc so the corners will appear rounded.

[Pirate]

See if this helps at all .Maybe needs some tweaking a little bit :

Function BorderRect() As Rectangle

Dim rec As Rectangle = Me.Button1.ClientRectangle

ReturnNew Rectangle(1, 1, rec.Width - 3, rec.Height - 3)

EndFunction

Sub DrawRoundedButtons(ByVal g As Graphics, ByVal p As Pen, ByVal rec As Rectangle, ByVal size As Size)

Dim oldSmoothingMode As SmoothingMode = g.SmoothingMode

g.SmoothingMode = SmoothingMode.AntiAlias

g.DrawLine(p, rec.Left + size.Width \ 2, rec.Top, rec.Right - size.Width \ 2, rec.Top)

g.DrawArc(p, rec.Right - size.Width, rec.Top, size.Width, size.Height, 270, 90)

g.DrawLine(p, rec.Right, rec.Top + size.Height \ 2, rec.Right, rec.Bottom - size.Height \ 2)

g.DrawArc(p, rec.Right - size.Width, rec.Bottom - size.Height, size.Width, size.Height, 0, 90)

g.DrawLine(p, rec.Right - size.Width \ 2, rec.Bottom, rec.Left + size.Width \ 2, rec.Bottom)

g.DrawArc(p, rec.Left, rec.Bottom - size.Height, size.Width, size.Height, 90, 90)

g.DrawLine(p, rec.Left, rec.Bottom - size.Height \ 2, rec.Left, rec.Top + size.Height \ 2)

g.DrawArc(p, rec.Left, rec.Top, size.Width, size.Height, 180, 90)

g.SmoothingMode = oldSmoothingMode

EndSub

PrivateSub Button1_Paint(ByVal sender AsObject, ByVal e As System.Windows.Forms.PaintEventArgs) Handles Button1.Paint

DrawRoundedButtons(e.Graphics, New Pen(Color.Black), BorderRect, New Size(16, 16))

EndSub

[RobDog888]

Ok, I got that to draw but how would I clear the square edges? I just need to
create a rectangle with the top two corners rounded and then fill it will a
gradient (I can do the fill part already). The background will be transparent
by default so when I draw the region and fill it the corners will be gone
already if the rectangle is rounded on top only.

This is the area that I need to convert to a region, I think, so it can be filled.

Function BorderRect() As Rectangle
        Dim rec As Rectangle = Me.cmdClose.ClientRectangle
        Return New Rectangle(1, 1, rec.Width - 3, rec.Height - 3)
    End Function
 
    Private Sub DrawRoundedButtons(ByVal g As Graphics, ByVal p As Pen, ByVal rec As Rectangle, ByVal size As Size)
        Dim oldSmoothingMode As SmoothingMode = g.SmoothingMode
        g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias
        'Top line
        g.DrawLine(p, rec.Left + size.Width \ 2, rec.Top, rec.Right - size.Width \ 2, rec.Top)
        'Right top corner
        g.DrawArc(p, rec.Right - size.Width, rec.Top, size.Width, size.Height, 270, 90)
        'Right line 
        g.DrawLine(p, rec.Right, rec.Top + size.Height \ 2, rec.Right, rec.Bottom)
        'Bottom line 
        g.DrawLine(p, rec.Right, rec.Bottom, rec.Left, rec.Bottom)
        'Left line 
        g.DrawLine(p, rec.Left, rec.Bottom, rec.Left, rec.Top + size.Height \ 2)
        'Left top corner
        g.DrawArc(p, rec.Left, rec.Top, size.Width, size.Height, 180, 90)
        g.SmoothingMode = oldSmoothingMode
    End Sub
 
    Private Sub Button1_Paint(ByVal sender As Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles cmdClose.Paint
        DrawRoundedButtons(e.Graphics, New Pen(Color.Black), BorderRect, New Size(16, 16))
    End Sub

Thanks

[RobDog888]

Ok, I think I may have it. I can get it to draw a region and fill it with a gradient.
Now I need to see if I can get it to draw on the background of my control
yet allow the text to be in front. If not then I will need to draw the text
too.

Note: this is on a button only as a test (75 x 23)

Private Sub Button1_Paint(ByVal sender As Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles Button1.Paint
        Dim myPath As New GraphicsPath
        'Top line
        myPath.AddLine(7, 0, 64, 0)
        'Right top arc
        myPath.AddArc(64, 0, 10, 10, 270, 90)
        'Right line
        myPath.AddLine(74, 7, 74, 22)
        'Bottom line
        myPath.AddLine(74, 22, 0, 22)
        'Left line
        myPath.AddLine(0, 22, 0, 7)
        'Left top arc
        myPath.AddArc(0, 0, 10, 10, 180, 90)
        ' Draw the path to the screen.
        Dim myPen As New Pen(Color.White, 1)
        e.Graphics.DrawPath(myPen, myPath)
        'Draw the gradient
        Dim br As New LinearGradientBrush(Me.ClientRectangle, Color.White, Color.CornflowerBlue, LinearGradientMode.Horizontal)
        e.Graphics.FillPath(br, myPath)
    End Sub
 
    Private Sub Form1_Resize(ByVal sender As Object, ByVal e As System.EventArgs) Handles MyBase.Resize
        Me.Button1.Invalidate()
    End Sub

[RobDog888]

So far so good. I am getting around the text by placing a label with a transparent
background as a child control. Now I have another problem, I need to draw a
circular button with a gradient border. Sounds like too much work so I want
to use an image.

how do I draw an image from a imagelist on my label?

[Pirate]

Something like this should draw the first picture in the imagelist on a a lable (this is in the paint event handler) :

[size=2]e.Graphics.DrawImage([/size][size=2][color=#0000ff]Me[/color][/size][size=2].ImageList1.Images(0), [/size][size=2][color=#0000ff]New[/color][/size][size=2] PointF(x, y))[/size]