Graphics - Rounded Corners & Drawing [Resolved]

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.

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.

VB Code:

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.

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

Code:

---

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



---

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.

VB Code:

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

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)

VB Code:

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

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?

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

VB Code:

[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]

Ok, thanks but I am thinking of making my own control out of this since its
evolving that way. Would I be able to use an IL on a control or would it be
better to use the image as a resource?

Thanks and sorry for the delay. I was remodeling my house all weekend.

Quote:

---

Originally Posted by RobDog888

Ok, thanks but I am thinking of making my own control out of this since its
evolving that way. Would I be able to use an IL on a control or would it be
better to use the image as a resource?

Thanks and sorry for the delay. I was remodeling my house all weekend.

---

Umm , can you jog my memory on this one "IL" (It wouldn't make sense if I say Intermediate Language , would it? :D )????

Sorry about that. I mean Image List. I think it may be better to use an image as a resource?

Quote:

---

Originally Posted by RobDog888

Sorry about that. I mean Image List. I think it may be better to use an image as a resource?

---

Lol :D
Well , both would work fine I guess . But I would prefer a resource image (as I've seen a lot used to do that) . You will have more control over the image not like when you have it in imageList which it'll get resized and the color will change probably .I've not actually tried to use ImageList in a UserControl (maybe not preferable) .

Ok resource it is. Only problem is that I only know how to do it in VB6 only.
Do you have an example that I can look over or ???

Thanks

I've some but they're in C# , I'll send it now if you can read C# . Or I'll TRY to do that in VB.NET (just simple one) .

I havent done anything in C# yet, but I know its similar to C++, which I still only
know a little of. Maybe between the both of us we could get a vb sample done?

Man , I forgot how to write code in VB.NET . Anyway , it's just a stupid sample that draws a picture on a panel from the a usercontrol class .

It's in VB.NET 2003 btw . You need to build the solution before you run or browse to the dll file . I'm sorry it's not commented but I'm here if you want to ask about anything . :bigyello:

Thanks, but I cant open it. I dont have WinRar. Could you upload a zip?
Thanks.

It's zipped now (look up). Sry but I love winRAR . :)

Oh no. I'm not falling for that one! :D

Thanks, be back in a bit after I have looked through it.

Ok, I have a question. If its a resource then why does the project still need
the file (Image/MyImage.bmp)? I see its of type embedded so would that
mean that when its compiled it will not need the image file?

Quote:

---

Originally Posted by RobDog888

Ok, I have a question. If its a resource then why does the project still need
the file (Image/MyImage.bmp)? I see its of type embedded so would that
mean that when its compiled it will not need the image file?

---

When you compile it , it won't need these resources anymore . Try to compile it and take the exe + dll in any different folder , run . It should work without adding the resources to that folder . sry for the delay btw . ;)

Doh! Ok, thanks I get it now. I just have to get it to draw from the resource now.

Is this correct?

VB Code:

Dim s As Stream = Me.GetType().Assembly.GetManifestResourceStream("MyApp.MyPic.jpg")
Dim bmp As Bitmap = New Bitmap(s)
s.Close()
Dim g As Graphics = CreateGraphics()
g.DrawImage(bmp, 0, 0)
bmp.Dispose()
g.Dispose()

But I need to draw my image that is round so the corners need to be transparent. :confused:

How about setting a labels image property to the resource?
Something like ...

VB Code:

Dim s As Stream = Me.GetType().Assembly.GetManifestResourceStream("MyApp.MyPic.jpg")
Dim bmp As Bitmap = New Bitmap(s)
s.Close()
Label1.Image = bmp '? What is the correct syntax?
bmp.Dispose()

*BUMP*

Quote:

---

Originally Posted by RobDog888

Is this correct?

visual basic code:Dim s As Stream = Me.GetType().Assembly.GetManifestResourceStream("MyApp.MyPic.jpg")

Dim bmp As Bitmap = New Bitmap(s)
s.Close()
Dim g As Graphics = CreateGraphics()
g.DrawImage(bmp, 0, 0)
bmp.Dispose()


g.Dispose()

But I need to draw my image that is round so the corners need to be transparent. :confused:

---

Shouldn't you resize the image(using bounds -1 all) to fit into your control (is it still panel or button) ?

No, this is for the image associated with a label. ;)

How should I do it? What am i missing in my latest code I posted?

Thanks.

Quote:

---

Originally Posted by RobDog888

How about setting a labels image property to the resource?
Something like ...

visual basic code:Dim s As Stream = Me.GetType().Assembly.GetManifestResourceStream("MyApp.MyPic.jpg")

Dim bmp As Bitmap = New Bitmap(s)
s.Close()
Label1.Image = bmp '? What is the correct syntax?


bmp.Dispose()

---

This is correct and it should work since you passed correct args . I didn't try this though .

Ok, so as long as Label1.Image = bmp works I should be fine. I will test in a few.

I'm getting an error for the stream. I dont know what namespace to import for it?

VB Code:

Dim s As [b]Stream[/b] = Me.GetType().Assembly.GetManifestResourceStream("MyApp.MyPic.jpg")

Doh! found it - Imports System.IO

Time to go to meeting. Be back.

What am I doing wrong? Its crashing at the ?

VB Code:

Dim s As Stream = Me.GetType().Assembly.GetManifestResourceStream("2_138.ico")
        Dim bmp As Icon = New Icon(s)
        s.Close()
        lnkSub1d.Image = CType(bmp, Icon).ToBitmap  '? What is the correct syntax?
        bmp.Dispose()

Why are you using the CType, it is already declared as an Icon. I think it should be bmp.ToBitmap.

Little late in the game - but this is code a few of us in the forums had thrown together about 2 years ago but somehow got wiped off the code bank.. round gradient buttons (that move when you click em if I remember, so it appears like a button does when pressed)

it is attached.

Its crashing on this line, and the resource is an icon.

VB Code:

Dim bmp As Icon = New Icon(s)

It throws an exception.

Resolved in this thread.