473,408 Members | 1,840 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,408 software developers and data experts.

Draw rounded rectangle inside a specific area

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,
Jan 18 '06 #1
7 10671
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

--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation
"Mark Ingram" <no****@nowhere.com> wrote in message
news:Ok*************@tk2msftngp13.phx.gbl...
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,

Jan 18 '06 #2
Ignacio Machin ( .NET/ C# MVP ) wrote:
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).
Jan 18 '06 #3
Hi,

"Mark Ingram" <no****@nowhere.com> wrote in message
news:Ol**************@TK2MSFTNGP10.phx.gbl...
Ignacio Machin ( .NET/ C# MVP ) wrote:
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).


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?
--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation
Jan 18 '06 #4
Ignacio Machin ( .NET/ C# MVP ) wrote:

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.
Jan 18 '06 #5
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.

Jan 18 '06 #6
Hi,

"Chris Dunaway" <du******@gmail.com> wrote in message
news:11*********************@g49g2000cwa.googlegro ups.com...
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)
--
Ignacio Machin,
ignacio.machin AT dot.state.fl.us
Florida Department Of Transportation
Jan 18 '06 #7
Chris Dunaway wrote:
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 :)
Jan 19 '06 #8

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
by: dunkonu | last post by:
I am new to VB.net, can anybody help me how to create a form that ask user to enter the "WIDTH" and "HEIGHT" and draw a box display in the textbox? thanks
2
by: Starlite | last post by:
I am using Microsoft visual c++ 6, and I want to draw a shape (say a rectangle) on a view. The code that I have used is below, but this draws a solid -filled rectangle, what I want is a displayed...
15
by: Steven T. Hatton | last post by:
The following may strike many of you as just plain silly, but it represents the kind of delelima I find myself in when trying to make a design decision. This really is a toy project written for...
3
by: Richard | last post by:
I have a requirement to put a GDI style circle or rectangle border around the selected row of a datagrid/ It will overlap into the row above and below the selected row. Doing this in a the OnPaint...
3
by: Colin McGuire | last post by:
Hi there. I have written a small procedure to draw various shapes on things. A bit of it is shown below. Private Sub drawShape(ByVal shapeType As Integer, ByRef g As Graphics) Select Case...
0
by: cmbardon | last post by:
I'm trying to create a form with some rounded controls, and I'm having some problems with the rounding not working correctly. I've tried a couple of different methods for creating the graphics...
1
by: Jeff Waskiewicz | last post by:
Hello All, I'm trying to solve a nagging problem. The goal is to draw a rectangle over the top of all the other controls on a form. Specifically, over a ChartFX control. The user would draw...
1
by: kidelectric | last post by:
The issue I am having is that I would like to be able to drag-and-drop div elements that have rounded corners.* Since these elements will be dynamically created (including background color), I could...
1
by: kummu4help | last post by:
hi, i want to draw rectangle based on mousedrag event. if user dragging the mouse, then the rectangle on the applet should increase or decrease basing on current mouse coordinates. i have the...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.