C# windows form circular button smoothing by anti-aliasing - c#

I'm New in c sharp, i'm trying to make a circular button. the code below is making a ellipse for me but it is not looking smooth, also it is having partially hidden lines at right and bottom as shown in image
class ButtonEllipse: Button
{
protected override void OnPaint(PaintEventArgs e)
{
GraphicsPath graphics = new GraphicsPath();
Rectangle myEllipse = new Rectangle(0, 0, this.ClientSize.Width,this.ClientSize.Height);
graphics.AddEllipse(myEllipse);
Pen myPen = new Pen(Color.Black, 2);
this.Region = new System.Drawing.Region(graphics);
base.OnPaint(e);
}
}
can you please guide me how to get a exact and smooth circular button.

Try setting graphics.SmoothingMode = SmoothingMode.AntiAlias; Read more about antialiazing.
You should perhaps also paint the button graphics directly rather than using the Region. See DrawEllipse and FillEllipse.

Related

Bitmap from Drawing not render outside of Load_Form

I'm trying to render bitmap created from drawing to screen but only render after minimize and maximize again.
I follow these steps: Using Bitmaps for Persistent Graphics in C#
But only can render bitmap in screen outside of Load_Form.
If I put the code:
using System.Drawing;
...
Graphics graphicsObj;
myBitmap = new Bitmap(this.ClientRectangle.Width,
this.ClientRectangle.Height,
Imaging.PixelFormat.Format24bppRgb);
graphicsObj = Graphics.FromImage(myBitmap);
Pen myPen = new Pen(Color.Plum, 3);
Rectangle rectangleObj = new Rectangle(10, 10, 200, 200);
graphicsObj.DrawEllipse(myPen, rectangleObj);
graphicsObj.Dispose();
In other place, for example a button, I need to minimize and maximize to see the image.
Edit:
bmp is a Bitmap global variable I create an instance in form event Load_Form1
bmp = new Bitmap(this.ClientRectangle.Width,
this.ClientRectangle.Height,
System.Drawing.Imaging.PixelFormat.Format24bppRgb);
Paint event of Form for redraw:
private void Form1_Paint(object sender, PaintEventArgs e)
{
Graphics graphicsObj = e.Graphics;
graphicsObj.DrawImage(myBitmap, 0, 0, myBitmap.Width, myBitmap.Height);
graphicsObj.Dispose();
}
But I need draw inmediately after create the drawing.
Not telling us about the bigger picture makes it hard to recommend the best course of action but let me simply assume two possible aims:
either you simply want something drawn onto the Form
or you want to display a bitmap into which you sucessively draw more and more things.
For the first all you need is to code the Paint event like this:
private void Form1_Paint(object sender, PaintEventArgs e)
{
Rectangle rectangleObj = new Rectangle(10, 10, 200, 200);
using (Pen myPen = new Pen(Color.Plum, 3))
e.Graphics.DrawEllipse(myPen, rectangleObj);
}
If the data that control the drawing are dynamic you should store them at class level variables or lists of them and change them as needed so you can use them in the Paint event.
For the latter aim there will be various times when you add to the Bitmap.
So you start by creating a, probably, class level Bitmap:
public Form1()
{
InitializeComponent();
bmp = new Bitmap(this.ClientRectangle.Width,
this.ClientRectangle.Height);
}
Bitmap bmp = null;
And have one or more places where you draw into it like this:
void drawALittle()
{
Rectangle rectangleObj = new Rectangle(10, 10, 200, 200);
using (Pen myPen = new Pen(Color.Plum, 3))
using (Graphics G = Graphics.FromImage(bmp))
{
G.DrawEllipse(myPen, rectangleObj);
//..
}
this.Invalidate();
}
Note how I Invalidate the Form after changing the Bitmap, so the Paint event is triggered.
Also note that if these update happen really often it will be a good idea to keep the Graphics object alive between calls; either by making it a class variable like the Bitmap or by keeping it locally in the method that does all the updates and passing it out as a parameter to the drawing method..
In the form's Paint event all you need is
private void Form1_Paint(object sender, PaintEventArgs e)
{
e.Graphics.DrawImage(bmp, 0, 0);
}
Also note that 32bppARGB is the recommended default format. Is is used for anything you display in any case, so it is most efficient to use it to begin with..

Draw ellipse with PaintEventArgs

I have a simple Photoshop-made grid and i would like to use it as progress bar, i need to draw round ellipses from 1 to 100 (then probably about 100 times in x time).
If I use System.Graphic I have not persistent result.
Then I found the code to use the PaintEventArgs method by inserting instructions in the Paint Event of the form.
Unfortunately in my mind this is not a solution because I need to draw only when I need and only where I want.... in other word I need a simple Function able to draw desired ellipses when I need...
I tried also to override the OnPaint-base but I really don't understand how to use it and if may help to reach my goal.
Here some code:
With the paint event:
private void Main_Paint(object sender, PaintEventArgs e)
{
// Create pen.
Pen blackPen = new Pen(Color.Yellow, 3);
// Create rectangle for ellipse.
Rectangle rect = new Rectangle(355, 282, 9, 9);
e.Graphics.DrawEllipse(blackPen, rect);
}
With the Graphic mode:
private void lbl_help_Click(object sender, EventArgs e)
{
//SetStatus("BURNING PROCESS COMPLETED SUCCESSFULLY");
Graphics g = this.CreateGraphics();
// Create pen.
Pen blackPen = new Pen(Color.Yellow, 3);
// Create rectangle for ellipse.
Rectangle rect = new Rectangle(355, 282, 9, 9);
// Draw ellipse to screen.
g.DrawEllipse(blackPen, rect);
System.Threading.Thread.Sleep(3000);
}
And this one I found to override OnPaint(), but I really don't know how to use it, how to override the form-paint event or how to call it only when needed and passing values:
private void lbl_help_Click(object sender, EventArgs e)
{
//SetStatus("BURNING PROCESS COMPLETED SUCCESSFULLY",);
Graphics g = this.CreateGraphics();
// Create pen.
Pen blackPen = new Pen(Color.Yellow, 3);
// Create rectangle for ellipse.
Rectangle rect = new Rectangle(355, 282, 9, 9);
// Draw ellipse to screen.
g.DrawEllipse(blackPen, rect);
System.Threading.Thread.Sleep(3000);
}
Something other other:
I imagine if I use variables to store the percentage and call a paint-refresh of the form (maybe invalidate?) to update the result should work but I will lose any sort of animation, elsewhere I come-back to a non persistent state again... I need to use the grid as a progress bar, adding circles only at desired time, without losing the back drawings...
The grid I need to fill is very simple, here a screenshot:
Sry I should not post image for the reputation (i'm a new user!), here the link
EDIT:
I solved the smoothing problem (at least with the Graphic Mode):
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;

Moving a high quality line on a panel c#

I want to draw a line on a panel and then move it as the mouse moves. To do so, I draw the line and when the mouse moves I redraw the line to the new location and remove the previous line by drawing a line with the background color on it. It works fine if I do not use the high quality smoothing mode. But if use high quality smoothing mode, it leave traces on the panel. Does anybody know how to fix this? Thank you.
Here is the code
int x_previous = 0;
int y_previous = 0;
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
Pen pen1 = new System.Drawing.Pen(Color.Black, 3);
Pen pen2 = new System.Drawing.Pen(panel1.BackColor, 3);
Graphics g = panel1.CreateGraphics();
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;
g.DrawLine(pen2, new Point(0, 0), new Point(x_previous, y_previous));
g.DrawLine(pen1, new Point(0, 0), new Point(e.Location.X, e.Location.Y));
x_previous = e.Location.X;
y_previous = e.Location.Y;
}
Here is the snapshot with SmoothingMode
Here is the snapshot without SmoothingMode
Instead of drawing a line over a line, the safest option would be to clear the graphics using g.Clear(panel1.BackColor). This will wipe everything off that has been drawn, so that you can safely draw a new line:
private void panel1_MouseMove(object sender, MouseEventArgs e)
{
Pen pen1 = new System.Drawing.Pen(Color.Black, 3);
Pen pen2 = new System.Drawing.Pen(panel1.BackColor, 3);
Graphics g = panel1.CreateGraphics();
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;
// Clear the graphics, creating a blank area to draw on
g.Clear(panel1.BackColor);
g.DrawLine(pen1, new Point(0, 0), new Point(e.Location.X, e.Location.Y));
x_previous = e.Location.X;
y_previous = e.Location.Y;
}
Hope this helps!
Instead of drawing the line in the event handler for the mouse movement you should use it to Invalidate the panel and perform the line drawing in a handler for its Paint event. There will be no need to erase the old line.
I haven't used WinForms in a while, so you'll have to forgive me if this doesn't work.
I assume that anti-aliasing has slightly blurred the edges of the line so that the initial line extends slightly further out than the width of the pen. That also means that the edges of the white pen won't be completely opaque when drawing over the black line.
Try increasing the width of the white pen until it completely covers the black, and maybe see if you can leave the Graphics object with lower quality rendering for the white pen, and use the smoothing only for the black pen.

Highlight the Rectangular Area while Dragging it

I am creating a image viewer sort of application. I am on Windows and using .Net
In my app, I am trying to highlight a Particular area while dragging.
I have created a Rectangle.
Rectangle areaRect = new Rectangle(100,100, 300, 300);
Point ptOld = new Point(0, 0);
Pen rectPen = new Pen(Brushes.White, 3);
protected override void OnPaint(PaintEventArgs e)
{
Graphics dcPaint = e.Graphics;
dcPaint.DrawRectangle(rectPen, areaRect);
}
Now I am dragging this rectangular area along with my mouse movements.
protected override void OnMouseMove(MouseEventArgs e)
{
Point ptNew = new Point(e.X, e.Y);
int dx = ptNew.X - ptOld.X;
int dy = ptNew.Y - ptOld.Y;
areaRect.Offset(dx, dy);
MoveRect(ptNew);
ptOld = ptNew;
}
Here I am trying to move this rect along with my mouse
void MoveRect(Point point)
{
Graphics grfxClient = CreateGraphics();
Rectangle tempRectangle = new Rectangle(areaRect.Left, areaRect.Top, areaRect.Width, areaRect.Height);
grfxClient.DrawRectangle(rectPen, tempRectangle);
this.Invalidate();
grfxClient.Dispose();
}
My Code till this point is working fine.
Now I would like to darken the INVERSE drag Area (The area which is outside the drag region), I mean the area which is within this Rectangle should gets highlighted while dragging.
Any idea how to proceed.
Thanks.
-Pankaj
I suppose you can do it by creating a Region object that covers the outside of the rectangle and fill it with a semi-transparent SolidBrush to make it look darkened.
You also don't have to create a graphics and draw in OnMouseMove event, but just shift the rectangle and invalidate the surface of the control you are drawing on.
The code I used looks more or less like this:
Rectangle areaRect = new Rectangle(100,100, 300, 300);
Point ptOld = new Point(0, 0);
Pen rectPen = new Pen(Brushes.White, 3);
//A new field with a semi-transparent brush to paint the outside of the rectangle
Brush dimmingBrush = new SolidBrush(Color.FromArgb(128, 0, 0, 0));
protected override void OnPaint(PaintEventArgs e)
{
Region outsideRegion = new System.Drawing.Region(e.ClipRectangle);
outsideRegion.Exclude(areaRect);
Graphics dcPaint = e.Graphics;
dcPaint.FillRegion(dimmingBrush, outsideRegion);
dcPaint.DrawRectangle(rectPen, areaRect);
}
protected override void OnMouseMove(MouseEventArgs e)
{
Point ptNew = new Point(e.X, e.Y);
int dx = ptNew.X - ptOld.X;
int dy = ptNew.Y - ptOld.Y;
areaRect.Offset(dx, dy);
ptOld = ptNew;
this.Invalidate();
}
The method named MoveRect is not needed.
It now seems to work as you wanted it to.
Suggestions
I also have some suggestions. You don't have to use them, maybe they will be helpful for you.
You haven't written what kind of control you are using to draw on (or overriding Form methods and painting directly on it), but I suggest you to use a PictureBox control, create a custom control derived from it and override its events. This should make the painting process smooth and prevent flickering. To do it this way:
Create a new user control by selecting Add and User Control... and name a new control i.e. MyPictureBox
change the parent class of the control, so it should now contain the line:
public partial class MyPictureBox : PictureBox
open file MyPictureBox.Designer.cs and comment out these lines:
//this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
//this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
copy the code I posted in this answer and add line base.OnPaint(e); and the beginning of OnPaint method
compile the project
now you should be able to open designer of your main form, drag MyPictureBox control from the toolbox and use it without additional code needed
You also might consider changing the behaviour of the highlighted area, so mouse cursor was in the center of it. I suppose it would be more intuitive to the user.
If you have any issues with the code, just write it in the comments and I'll try to help :).

Why doesn't FillPolygon draw after FillRectangle?

I'm drawing directly onto a form with two FillPolygon statements to create two arrows - one black, one white. (The white arrow is slightly smaller and drawn over the black arrow.)
Here's the code in the form's OnPaint.
protected override void OnPaint(PaintEventArgs e)
{
Graphics g = e.Graphics;
g.FillPolygon(brushBlack, travelArrow);
g.FillPolygon(brushWhite, featureArrow);
}
Works great. Now since the white arrow is going to be drawn several times in different rotations, I decided to use double-buffering to avoid as much flicker as possible.
I first created a DrawFeatureArrow method that I call in OnPaint.
protected override void OnPaint(PaintEventArgs e)
{
Graphics g = e.Graphics;
g.FillPolygon(brushBlack, travelArrow);
DrawFeatureArrow(this, e);
}
Note: There's no rotation of the white arrow coded yet, I'm just trying to get the double-buffering set up.
DrawFeatureArrow looks like this.
private void DrawFeatureArrow(object sender, PaintEventArgs e)
{
Bitmap buffer = new Bitmap(60, 159);
Graphics gOff = Graphics.FromImage(buffer);
gOff.FillRectangle(brushGreen, 0, 0, buffer.Width, buffer.Height);
gOff.FillPolygon(brushWhite, featureArrow);
ImageAttributes attr = new ImageAttributes();
attr.SetColorKey(Color.Green, Color.Green);
Rectangle srcRect = new Rectangle(0, 0, bugger.Width, buffer.Height);
Rectangle destRect = new Rectangle(90, 66, 60, 159);
Graphics f = e.Graphics;
// Should draw green rectangle and white arrow
f.DrawImage(buffer, 90, 66); // Draws just a green rectangle
// If uncommented, should draw just white arrow (green rectangle hidden by SetColorKey)
// f.DrawImage(buffer, destRect, 0, 0, buffer.Width, buffer.Height, GraphicsUnit.Pixel, attr);
f.Dispose();
gOff.Dispose();
buffer.Dispose();
}
When run, the green rectangle is drawn but not the white arrow.
Strangely enough, in DrawFeatureArrow, if you replace this
gOff.FillPolygon(brushWhite, featureArrow);
With this
gOff.FillRectangle(brushWhite, 10, 10, 20, 20);
You get a tiny white rectangle in the upper left of the green rectangle.
Very strange behavior. Hope someone can point out what I'm doing incorrectly.
Thanks in advance for the help.
You're drawing your feature arrow over buffer that has dimensions of 60, 159. Maybe the location of the feature arrow is outside of those dimensions and therefore did not end in the bitmap.

Categories

Resources