Develop Reference

How to use AddArc() method in C#

I have this little code to use AddArc() method in a label, but when I execute the code the label disappears. I believe it is the numbers I have used, I followed instructions from the Windows documentation and it had these parameters there too.
GraphicsPath gp = new GraphicsPath();
Rectangle rec = new Rectangle(20, 20, 50, 100);
gp.AddArc(rec, 0 , 180);
label2.Region = new Region(gp);
label2.Invalidate();
I used another code to make the correct way or curve in a text
protected override void OnPaint(PaintEventArgs e)
{
base.OnPaint(e);
var center = new Point(Width / 2, Height / 2);
var radius = Math.Min(Width, Height) / 3;
var text = "Hello";//txtUp.Text;
var font = new Font(FontFamily.GenericSansSerif, 24, FontStyle.Bold);
for (var i = 0; i < text.Length; ++i)
{
var c = new String(text[i], 1);
var size = e.Graphics.MeasureString(c, font);
var charRadius = radius + size.Height;
var angle = (((float)i / text.Length) - 2);
var x = (int)(center.X + Math.Cos(angle) * charRadius);
var y = (int)(center.Y + Math.Sin(angle) * charRadius);
e.Graphics.TranslateTransform(x, y);
e.Graphics.RotateTransform((float)(90 + 360 * angle / (2 * Math.PI)));
e.Graphics.DrawString(c, font, Brushes.Red, 0, 0);
e.Graphics.ResetTransform();
e.Graphics.DrawArc(new Pen(Brushes.Transparent, 2.0f), center.X - radius, center.Y - radius, radius * 2, radius * 2, 0, 360);
}
}
but it wont show in front of a panel is it possible.
This is what it looks like:
Is it possible to move that text in front of the green circle?

Properly rotate an image

How to I rotate an image without it showing like this?
Here's my Rotation Method:
public static Bitmap RotateImageN(Bitmap bmp, float angle)
{
Bitmap rotatedImage = new Bitmap(bmp.Width, bmp.Height);
using (Graphics g = Graphics.FromImage(rotatedImage))
{
// Set the rotation point to the center in the matrix
g.TranslateTransform(bmp.Width / 2, bmp.Height / 2);
// Rotate
g.RotateTransform(angle);
// Restore rotation point in the matrix
g.TranslateTransform(-bmp.Width / 2, -bmp.Height / 2);
// Draw the image on the bitmap
g.DrawImage(bmp, new Point(0, 0));
}
return rotatedImage;
}
Edit: After trying Loocid's Code

Your rotatedImage Bitmap needs to be big enough to accommodate the rotated image.
Say you rotated your original image by 30° you need to get the size of the bounding box like so:
Using some basic trig:
x = L*cos(30 * π / 180) + w*cos(60 * π / 180)
y = L*sin(30 * π / 180) + w*sin(60 * π / 180)
Therefore change the start of your code to:
var x = bmp.Width * Math.Cos(angle * Math.PI / 180) + bmp.Height * Math.Cos((90-angle) * Math.PI / 180)
var y = bmp.Width * Math.Sin(angle * Math.PI / 180) + bmp.Height * Math.Sin((90-angle) * Math.PI / 180)
Bitmap rotatedImage = new Bitmap(x, y);

The issue occurs in the rotating is related to the bounding box. It is clipping the edge because of the image you provided does not fit into the area that you have given.
I also faced this issue. So I tried a solution from here.
Adding the code that works for me.
public static Bitmap RotateImageN(Bitmap bitmap, float angle)
{
Matrix matrix = new Matrix();
matrix.Translate(bitmap.Width / -2, bitmap.Height / -2, MatrixOrder.Append);
matrix.RotateAt(angle, new System.Drawing.Point(0, 0), MatrixOrder.Append);
using (GraphicsPath graphicsPath = new GraphicsPath())
{
graphicsPath.AddPolygon(new System.Drawing.Point[] { new System.Drawing.Point(0, 0), new System.Drawing.Point(bitmap.Width, 0), new System.Drawing.Point(0, bitmap.Height) });
graphicsPath.Transform(matrix);
System.Drawing.PointF[] points = graphicsPath.PathPoints;
Rectangle rectangle = boundingBox(bitmap, matrix);
Bitmap resultBitmap = new Bitmap(rectangle.Width, rectangle.Height);
using (Graphics gDest = Graphics.FromImage(resultBitmap))
{
Matrix mDest = new Matrix();
mDest.Translate(resultBitmap.Width / 2, resultBitmap.Height / 2, MatrixOrder.Append);
gDest.Transform = mDest;
gDest.DrawImage(bitmap, points);
return resultBitmap;
}
}
}
private static Rectangle boundingBox(Image image, Matrix matrix)
{
GraphicsUnit graphicsUnit = new GraphicsUnit();
Rectangle boundingRectangle = Rectangle.Round(image.GetBounds(ref graphicsUnit));
Point topLeft = new Point(boundingRectangle.Left, boundingRectangle.Top);
Point topRight = new Point(boundingRectangle.Right, boundingRectangle.Top);
Point bottomRight = new Point(boundingRectangle.Right, boundingRectangle.Bottom);
Point bottomLeft = new Point(boundingRectangle.Left, boundingRectangle.Bottom);
Point[] points = new Point[] { topLeft, topRight, bottomRight, bottomLeft };
GraphicsPath graphicsPath = new GraphicsPath(points, new byte[] { (byte)PathPointType.Start, (byte)PathPointType.Line, (byte)PathPointType.Line, (byte)PathPointType.Line });
graphicsPath.Transform(matrix);
return Rectangle.Round(graphicsPath.GetBounds());
}

How can I add a text to an arrow?

I am currently working on an arrow, containing a text (here 'Test'), that shows an offset.
My code is:
Width = 200;
Length = 1000;
double arrowHeadWidth = Width;
double arrowHeadLength = Width / 2;
double arrowWidth = Width - arrowHeadWidth / 2;
double arrowLength = Length;
double centerY = Width / 2.0;
var figure = new PathFigure
{
IsClosed = true,
StartPoint = new Point(0, centerY - arrowWidth / 2.0)
};
figure.Segments.Add(new LineSegment(new Point(arrowLength - arrowHeadLength, centerY - arrowWidth / 2.0), true));
figure.Segments.Add(new LineSegment(new Point(arrowLength - arrowHeadLength, centerY - arrowHeadWidth / 2.0), true));
figure.Segments.Add(new LineSegment(new Point(arrowLength, centerY), true));
figure.Segments.Add(new LineSegment(new Point(arrowLength - arrowHeadLength, centerY + arrowHeadWidth / 2.0), true));
figure.Segments.Add(new LineSegment(new Point(arrowLength - arrowHeadLength, centerY + arrowWidth / 2.0), true));
figure.Segments.Add(new LineSegment(new Point(0, centerY + arrowWidth / 2.0), true));
var geometry = new PathGeometry();
geometry.Figures.Add(figure);
var borderPen = new Pen(Brushes.White, 10)
{
LineJoin = PenLineJoin.Round
};
var arrowDrawing = new GeometryDrawing(Brushes.Transparent, borderPen, geometry);
FormattedText formattedText = new FormattedText(
"Test",
System.Globalization.CultureInfo.CurrentUICulture,
FlowDirection.LeftToRight,
new Typeface("Tahoma"),
12,
Brushes.Black);
formattedText.MaxTextWidth = arrowLength - 40;
formattedText.MaxTextHeight = arrowWidth - 10;
Geometry textGeometry = formattedText.BuildGeometry(new System.Windows.Point(20, 5));
GeometryDrawing textDrawing = new GeometryDrawing(Brushes.Red, new Pen(Brushes.Red, 1), textGeometry);
var drawingGroup = new DrawingGroup();
drawingGroup.Children.Add(arrowDrawing);
drawingGroup.Children.Add(textDrawing);
var brush = new DrawingBrush(drawingGroup);
But I only get the arrow shown. What am I doing wrong?
If I comment out the line drawingGroup.Children.Add(arrowDrawing); I get the text displayed.
Any suggestions would help. Thanks in advance,
Benny
Edit:
Creation of arrow added

Rotate and Scale rectangle as per user control

I have UserControl of Size 300*200.
and rectangle of size 300*200.
graphics.DrawRectangle(Pens.Black, 0, 0, 300, 200);
When I rotate rectangle in userControl by 30 degree, I get rotated rectangle but it is outsized.
PointF center = new PointF(150,100);
graphics.FillRectangle(Brushes.Black, center.X, center.Y, 2, 2); // draw center point.
using (Matrix matrix = new Matrix())
{
matrix.RotateAt(30, center);
graphics.Transform = matrix;
graphics.DrawRectangle(Pens.Black, 0, 0, 300, 200);
graphics.ResetTransform();
}
I want to fit rectangle like actual result.Check Image here
Can anyone have solution about this.
Thanks.

It's more of a math question than programming one.
Calculate bouning box of any rectangle rotated by any angle in radians.
var newWidth= Math.Abs(height*Math.Sin(angle)) + Math.Abs(width*Math.Cos(angle))
var newHeight= Math.Abs(width*Math.Sin(angle)) + Math.Abs(height*Math.Cos(angle))
Calculate scale for x and y:
scaleX = width/newWidth;
scaleY = height/newHeight;
Apply it to your rectangle.
EDIT:
Applied to your example:
PointF center = new PointF(150, 100);
graphics.FillRectangle(Brushes.Black, center.X, center.Y, 2, 2); // draw center point.
var height = 200;
var width = 300;
var angle = 30;
var radians = angle * Math.PI / 180;
var boundingWidth = Math.Abs(height * Math.Sin(radians)) + Math.Abs(width * Math.Cos(radians));
var boundingHeight = Math.Abs(width * Math.Sin(radians)) + Math.Abs(height * Math.Cos(radians));
var scaleX = (float)(width / boundingWidth);
var scaleY = (float)(height / boundingHeight);
using (Matrix matrix = new Matrix())
{
matrix.Scale(scaleX, scaleY, MatrixOrder.Append);
matrix.Translate(((float)boundingWidth - width) / 2, ((float)boundingHeight - height) / 2);
matrix.RotateAt(angle, center);
graphics.Transform = matrix;
graphics.DrawRectangle(Pens.Black, 0, 0, width, height);
graphics.ResetTransform();
}

Empty space between two shapes in GDI+

I am trying to draw a custom drop shadow in GDI+ (C#). I keep having this awkward look:
I guess I could solve it by adding a pixel to the arc's width, but then the shapes overlap.
Preview http://puu.sh/2sv2N
I have absolutely no idea what is causing this small piece of white.
Here's my code:
Rectangle drawRect = new Rectangle(10, 10, 400, 400);
radius = 10;
// TOP //
Rectangle topRect = new Rectangle(drawRect.X + radius, drawRect.Y, drawRect.Width - 2 * radius, radius);
LinearGradientBrush topBrush = new LinearGradientBrush(new Rectangle(topRect.X, topRect.Y - 1, topRect.Width,topRect.Height + 2), firstColor, secondColor, 270f);
g.FillRectangle(topBrush, topRect);
topBrush.Dispose();
// LEFT //
Rectangle leftRect = new Rectangle(drawRect.X, drawRect.Y + radius, radius, drawRect.Height - 2 * radius);
LinearGradientBrush leftBrush = new LinearGradientBrush(new Rectangle(leftRect.X - 1, leftRect.Y, leftRect.Width + 2, leftRect.Height), firstColor, secondColor, 180f);
g.FillRectangle(leftBrush, leftRect);
leftBrush.Dispose();
// TOP LEFT //
GraphicsPath topLeftPath = new GraphicsPath();
topLeftPath.StartFigure();
topLeftPath.AddArc(new Rectangle(drawRect.X, drawRect.Y, 2 * radius, 2 * radius), 180, 90);
topLeftPath.AddLine(new Point(drawRect.X + radius, drawRect.Y), new Point(drawRect.X + radius, drawRect.Y + radius));
topLeftPath.AddLine(new Point(drawRect.X + radius, drawRect.Y + radius), new Point(drawRect.X, drawRect.Y + radius + 1));
topLeftPath.CloseFigure();
PathGradientBrush topLeftBrush = new PathGradientBrush(topLeftPath);
topLeftBrush.CenterPoint = new PointF(drawRect.X + radius, drawRect.Y + radius);
topLeftBrush.CenterColor = firstColor;
topLeftBrush.SurroundColors = new Color[] { secondColor };
g.FillPath(topLeftBrush, topLeftPath);
topLeftBrush.Dispose();
topLeftPath.Dispose();
Thanks in advance

Thanks to LarsTech, I got the working solution.
e.Graphics.PixelOffsetMode = PixelOffsetMode.Half;
That did the job.
Thank you !