Help with a Bezier?

Hi everyone,

I am struggling a bit trying to use a Bezier (DrawPath) to create a tab border like this: image

I haven’t had too much success trying to get AddArc and AddCurveToPath. With all my canvas experience I really hadn’t ever used this class much so thank you in advance!

Threw this together, hope it helps a bit, the 2nd control point needs to be at 90 degrees to the first and final points to get a quarter circle (think of a right angle triangle with the point in the top left corner). The line width needs to be taken into account as if you’re essentially drawing down the middle of the line with vectors so a 1 pen width will need to be on 0.5’s.

Dim p As New GraphicsPath
p.MoveToPoint(0.5, 40.5)
p.AddLineToPoint(10.5, 40.5)
p.AddLineToPoint(10.5, 10.5)
p.AddCurveToPoint(10.5, 10.5, 10.5, 0.5, 20.5, 0.5)
p.AddLineToPoint(60.5, 0.5)

'p.AddCurveToPoint(60.5, 0.5, 70.5, 0.5, 70.5, 10.5) 'continuing along the line makes the antialiasing look different so we do it this way:

p.MoveToPoint(70.5, 10.5) 'move to the end of the curve so we can draw it back where we came from
p.AddCurveToPoint(70.5, 10.5, 70.5, 0.5, 60.5, 0.5) 'draw it backwards so we have similar antialiasing
p.MoveToPoint(70.5, 10.5) 'move to the end of the curve to carry on the line

'carry on with the line
p.AddLineToPoint(70.5, 40.5)
p.AddLineToPoint(80.5, 40.5)

g.DrawPath(p, False)

Or something a bit more generic

g.PenSize = 1

Dim height As Double = 40
Dim width As Double = 50
Dim curve As Double = 10
Dim offset As Double = 10

Dim p As New GraphicsPath
p.MoveToPoint(g.PenSize / 2, height + g.PenSize / 2)
p.AddLineToPoint(offset + g.PenSize / 2, height + g.PenSize / 2)
p.AddLineToPoint(offset + g.PenSize / 2, curve + g.PenSize / 2)
p.AddCurveToPoint(offset + g.PenSize / 2, curve + g.PenSize / 2, offset + g.PenSize / 2, g.PenSize / 2, offset + curve + g.PenSize / 2, g.PenSize / 2)
p.AddLineToPoint(offset + width - g.PenSize / 2, g.PenSize / 2)

'p.AddCurveToPoint(60.5, 0.5, 70.5, 0.5, 70.5, 10.5) 'continuing along the line makes the antialiasing look different so we do it this way:

p.MoveToPoint(offset + width + curve - g.PenSize / 2, curve + g.PenSize / 2) 'move to the end of the curve so we can draw it back where we came from
p.AddCurveToPoint(offset + width + curve - g.PenSize / 2, curve + g.PenSize / 2, offset + width + curve - g.PenSize / 2, g.PenSize / 2, offset + width - g.PenSize / 2, g.PenSize / 2) 'draw it backwards so we have similar antialiasing
p.MoveToPoint(offset + width + curve - g.PenSize / 2, curve + g.PenSize / 2) 'move to the end of the curve to carry on the line

'carry on with the line
p.AddLineToPoint(offset + width + curve - g.PenSize / 2, height + g.PenSize / 2)
p.AddLineToPoint(offset + width + curve + offset - g.PenSize / 2, height + g.PenSize / 2)

g.DrawPath(p, False)

Thank you greatly @JulianS! I will try this tonight.

@JulianS you are brilliant and thank you once again! Your second code set is what I needed with some minor adjustments for width, offset, and curve.

Thank you!
Mike

3 Likes