Draw rounded rectangle inside a specific area

[Mark Ingram]

Hi, how can i draw a rounded rectange, with a border within a specified
area?

i.e. if i have a Rectangle with width and height of 100, how can i draw
a rectange with 2 pixel border inside of the original one? (the current
attempts all draw the border just outside of the original rectangle).

At the moment im using the following code, but it allows the rectangle
to grow - which i definately dont want!

m_edgePath = new GraphicsPath();

Point topLeft = new Point(this.ClientRectangle.Left +
m_borderWidth, this.ClientRectangle.Top + m_borderWidth);
Point topRight = new Point(this.ClientRectangle.Right -
m_curveSize.Width - m_borderWidth, this.ClientRectangle.Top +
m_borderWidth);
Point bottomRight = new Point(this.ClientRectangle.Right -
m_curveSize.Width - m_borderWidth, this.ClientRectangle.Bottom -
m_curveSize.Height - m_borderWidth);
Point bottomLeft = new Point(this.ClientRectangle.Left +
m_borderWidth, this.ClientRectangle.Bottom - m_curveSize.Height -
m_borderWidth);

m_edgePath.AddArc(topLeft.X, topLeft.Y, m_curveSize.Width,
m_curveSize.Height, 180, 90);
m_edgePath.AddArc(topRight.X, topRight.Y, m_curveSize.Width,
m_curveSize.Height, 270, 90);
m_edgePath.AddArc(bottomRight.X, bottomRight.Y, m_curveSize.Width,
m_curveSize.Height, 0, 90);
m_edgePath.AddArc(bottomLeft.X, bottomLeft.Y, m_curveSize.Width,
m_curveSize.Height, 90, 90);
m_edgePath.CloseFigure();

Region preWidenRegion = new Region(m_edgePath);

m_edgePath.Widen(new Pen(Color.Black, m_borderWidth));

Region postWidenRegion = new Region(m_edgePath);

m_edgeRegion = new Region();
m_edgeRegion.MakeEmpty();

m_edgeRegion.Union(preWidenRegion);
m_edgeRegion.Union(postWidenRegion);




Thanks,

 

[Ignacio Machin \( .NET/ C# MVP \)]

Hi Mark,


Not sure if there is no direct way of doing it, but it should be simple
doing something like:

1- Draw the 4 lines that will conform the rectangle , you do it 4 pixels
short to leave space for the corners. like :
DrawLine( thePen, startX+2 , startY, endX-2 , startY ) // the top
horizontal
DrawLine( thePen, startX , startY + 2, startX , startY-2 ) //the
left vertical
2- using DrawArc you draw the corners ,
DrawArc( thePen, new Rectangle( startX, startY, 2, 2) , 270, 360 )
//top left corner


it should work

 

[Mark Ingram]

Hi Mark,


Not sure if there is no direct way of doing it, but it should be simple
doing something like:

1- Draw the 4 lines that will conform the rectangle , you do it 4 pixels
short to leave space for the corners. like :
DrawLine( thePen, startX+2 , startY, endX-2 , startY ) // the top
horizontal
DrawLine( thePen, startX , startY + 2, startX , startY-2 ) //the
left vertical
2- using DrawArc you draw the corners ,
DrawArc( thePen, new Rectangle( startX, startY, 2, 2) , 270, 360 )
//top left corner


it should work

Its not the actual arcs or lines that are causing the problems, its the
drawing with the pen, if you use anything bigger than width 1, it starts
growing outside of the rectangle.

i.e. if you use PenWidth of 2, the rectangle will increase in size to
102x102 (extra 1 pixel on each side).

 

[Ignacio Machin \( .NET/ C# MVP \)]

Hi,

Its not the actual arcs or lines that are causing the problems, its the
drawing with the pen, if you use anything bigger than width 1, it starts
growing outside of the rectangle.

i.e. if you use PenWidth of 2, the rectangle will increase in size to
102x102 (extra 1 pixel on each side).

Well, what do you expect? if the pen is bigger than 1 you should calculate
accordingly ,

Another question, if this is the same pen used to draw the lines you should
have the same problem no? or it start at the selected X and takes 2 pixels
to the right?
What happens in the right side?

 

[Mark Ingram]

Well, what do you expect? if the pen is bigger than 1 you should calculate
accordingly ,

Another question, if this is the same pen used to draw the lines you should
have the same problem no? or it start at the selected X and takes 2 pixels
to the right?
What happens in the right side?

If i draw with a 2 pixel width pen, there is a 1 pixel border all the
way around the outside of the rectangle, i want the 2 pixel border to be
inside the rectangle. normally this wouldnt be a problem, but with the
rounded edges its being a right pain. any help is much appreciated.

 

[Chris Dunaway]

Take a look at the Pen.Alignment property and the PenAlignment
enumeration. Have you tried setting the Alignment property to Inset?
The default is Center.

Perhaps this will help you.

 

[Ignacio Machin \( .NET/ C# MVP \)]

Hi,

Take a look at the Pen.Alignment property and the PenAlignment
enumeration. Have you tried setting the Alignment property to Inset?
The default is Center.

I think this is the solution

Also note that with a little math he could had solve this before, if you see
that the draw is centered in the pen, well then just shrink it accordingly ,
(1/2 the width of the pen)

 

[Mark Ingram]

Take a look at the Pen.Alignment property and the PenAlignment
enumeration. Have you tried setting the Alignment property to Inset?
The default is Center.

Perhaps this will help you.

Thats great, should do the trick nicely