Graphics FillPolygon exterior? - vb.net

I've created a simple test app that will draw a polygon onto an image given the points I provide. I've created a brush that will fill in the polygon how I want to. Now I want to fill in everything BUT the polygon. So, using my brush, I want to draw around the polygon so all that is visible is what's inside the polygon. Does anyone know how I may be able to accomplish this?
Thanks in advance!

I was surprised not to find this answer anywhere but in looking at the documentation for System.Drawing.Region
the answer seemed very simple.
We can Exclude the polygon (which I assume would need to be a GraphicsPath), from an infinite region. Region.XOR should work the same as Exclude in this case:
Region region = new Region();
region.MakeInfinite();
GraphicsPath polygonPath = GetYourPolygon();
region.Exclude(polygonPath);
e.Graphics.FillRegion(Brushes.Black, region);
In my case I just needed to exclude a plain RectangleF but this did the trick, it filled the surrounding area and left the excluded area alone.

I think that System.Drawing.Graphics.Clip is what you want.
Here is a code sample from that link:
Private Sub SetAndFillClip(ByVal e As PaintEventArgs)
' Set the Clip property to a new region.
e.Graphics.Clip = New Region(New Rectangle(10, 10, 100, 200))
' Fill the region.
e.Graphics.FillRegion(Brushes.LightSalmon, e.Graphics.Clip)
' Demonstrate the clip region by drawing a string
' at the outer edge of the region.
e.Graphics.DrawString("Outside of Clip", _
New Font("Arial", 12.0F, FontStyle.Regular), _
Brushes.Black, 0.0F, 0.0F)
End Sub
To fill everything outside of the region, then you would have to determine the extents of the DC that you are drawing to and then fill that rect, after having set Graphics.Clip to a Region created from your points.
So, you code might look something like this:
Private Sub SetAndFillClip(ByVal e As PaintEventArgs)
' Set the Clip property to a new region.
e.Graphics.Clip = GetRegionFromYourPoints()
' Fill the entire client area, clipping to the Clip region
e.Graphics.FillRectangle(Brushes.LightSalmon, GetWindowExtentsFromYourWindow())
End Sub
This link shows how to create a Region from an array of points:
http://www.vb-helper.com/howto_net_control_region.html

Those who didn't find the solution yet, have a look at this. Worked for me, out of the box. Do as follows,
protected override void OnPaint(PaintEventArgs e)
{
base.OnPaint(e);
var points = new []
{
new PointF(150, 250),
new PointF( 50, 500),
new PointF(250, 400),
new PointF(300, 100),
new PointF(500, 500),
new PointF(500, 50),
};
using (var path = new GraphicsPath())
{
path.AddPolygon(points);
// Uncomment this to invert:
// p.AddRectangle(this.ClientRectangle);
using (var brush = new SolidBrush(Color.Black))
{
e.Graphics.FillPath(brush, path);
}
}
}

Related

Drawing on an image before drawing on screen in XNA using VB.NET

I'm programming a game in XNA, using VB.NET. I want to create an intro to the game that zooms in/out the whole screen and scaling each image to accomplish this is cumbersome at best. I like to be able to draw a lot of .PNG's (or parts of them) onto a whole image, to then be able to manipulate (scale, turn etc) that whole image, before drawing it with the spriteBatch. The examples I can find use something like:
dim bitmap as New Bitmap
or
dim image as New Image
but these codes highlights the "Bitmap" or "Image" as red, and I cannot use them. I'd be thankful for any help on this issue!
SpriteBatch works with XNA Texture2D objects, whereas Bitmap and Image are System.Drawing types. They do not work together.
You can create a new RenderTarget2D, set it as active using GraphicsDevice.SetRenderTarget() and draw there using a SpriteBatch. You can then draw the stored render target to screen using a SpriteBatch, since render targets are a type of Texture2D.
So I've experimented with Petri Laarne's answer and finally come up with a workable code (most examples online are using C#, and doesn't explain the entire process). Trying to explain it here:
In Public Class Game1:
Private WithEvents graphics As GraphicsDeviceManager
Private WithEvents spriteBatch, spriteBatch2 As SpriteBatch
In Loadcontent:
Public render2 As RenderTarget2D
spriteBatch2 = New SpriteBatch(GraphicsDevice)
spriteBatch = New SpriteBatch(GraphicsDevice)
render2 = New RenderTarget2D(GraphicsDevice, 1024, 768)
In Draw:
spriteBatch2.GraphicsDevice.SetRenderTarget(render2)
GraphicsDevice.Clear(Color.Black)
srcRect = New Rectangle(440, 0, 440, 440) : destRect = New Rectangle(100, 335, 440, 440)
spriteBatch2.Begin(SpriteSortMode.BackToFront, BlendState.AlphaBlend) : spriteBatch2.Draw(introNEWMirrorDecos, destRect, srcRect, Color.White) : spriteBatch2.End()
destRect = New Rectangle(300, 335, 440, 440)
spriteBatch2.Begin(SpriteSortMode.BackToFront, BlendState.AlphaBlend) : spriteBatch2.Draw(introNEWMirrorDecos, destRect, srcRect, Color.White) : spriteBatch2.End()
spriteBatch2.GraphicsDevice.SetRenderTarget(Nothing)
GraphicsDevice.Clear(Color.Black)
destRect = New Rectangle(512, 384, 1024, 768) : srcRect = New Rectangle(0, 0, 1024, 768)
spriteBatch.Begin(SpriteSortMode.BackToFront, BlendState.AlphaBlend) : spriteBatch.Draw(render2, destRect, srcRect, Color.White, PI / 12, New Vector2(512, 384), SpriteEffects.None, 0) : spriteBatch.End()
This is an example code from the actual game that worked like it was intended: drawing 2 things on the alternate rendering image and then drawing them as one single image (in this case being able to rotate it by pi/12).
Any comments on how to do this differently or more efficient is appreciated, and thank's for the initial answer #Petri Laarne

Place Text in Image on Edges

This tool I wrote in Visual Basic 2010 should add an author text to images. The user is able to set the font opacity and position. To make things easier I wanted some position presets as one can see in the bottom right corner. The calculation I am using is (bottom right in this case:
Dim textSize As Size = TextRenderer.MeasureText(tagString + curText, curFont)
tmpPos = New Point(srcImg.Width - textSize.Width - 10, srcImg.Height - textSize.Height - 10)
As you can see this works perfectly for this example picture. Where as on some the text just clips out.
First One: 1024x768 | Detected Font Size: 680x72
Second One: 1688x1125 | Detected Font Size: 680x72
I suspect this has something to do with the aspect ratio of the images but I do not know how to fix it.
The text is drawn like that:
brush = New SolidBrush(color.FromArgb(alpha, color))
gr = Graphics.FromImage(editImg)
gr.DrawString(tagString + text, font, brush, pos)
HauptBild.Image = editImg
I found this http://www.codeproject.com/Articles/20923/Mouse-Position-over-Image-in-a-PictureBox and it answered my questions.
is this problem only occuring in your preview or also in the converted File? Please post the Code how you save the New Image. I think you have Set a sizemode in your picturebox which is the Problem. Try it without the sizemode.
Will be better to see more your code, but, as i understand by TextRenderer class it is System.Windows.Forms. Just do not use Graphics, created from control (i suppose it is pictureBox with sizemode:Zoom), use Graphics, created from your image instead.
Here is code (sorry, C#), which loads image from file, draws text starting from the same coordinate and places on puctureBox1. Text always starts from Point(100,100).
OpenFileDialog openFileDialog1 = new OpenFileDialog();
openFileDialog1.Filter = "Image files|*.jpeg;*.png;*.jpg;*.gif;*.bmp";
if(openFileDialog1.ShowDialog() == DialogResult.OK)
{
try
{
Bitmap orig=(Bitmap)Bitmap.FromFile(openFileDialog1.FileName);
//workaround for images with color table, see remarks here https://msdn.microsoft.com/en-us/library/system.drawing.graphics.fromimage(v=vs.110).aspx
Bitmap bmp=orig.Clone(new Rectangle(0, 0, orig.Width, orig.Height), System.Drawing.Imaging.PixelFormat.Format32bppPArgb);
Graphics g = Graphics.FromImage(bmp);
g.DrawString("hello", new Font(this.Font.FontFamily,30,FontStyle.Bold ) , new System.Drawing.SolidBrush(System.Drawing.Color.Yellow ), new Point(100, 100));
this.pictureBox1.Image = bmp;
orig.Dispose();
}
catch (Exception ex)
{
MessageBox.Show("Something goes wrong: " + ex.Message+ "\\n"+ ex.StackTrace );
}
}

Background Image Is Other Image Vb.net [duplicate]

In my C# Form I have a Label that displays a download percentage in the download event:
this.lblprg.Text = overallpercent.ToString("#0") + "%";
The Label control's BackColor property is set to be transparent and I want it to be displayed over a PictureBox. But that doesn't appear to work correctly, I see a gray background, it doesn't look transparent on top of the picture box. How can I fix this?
The Label control supports transparency well. It is just that the designer won't let you place the label correctly. The PictureBox control is not a container control so the Form becomes the parent of the label. So you see the form's background.
It is easy to fix by adding a bit of code to the form constructor. You'll need to change the label's Parent property and recalculate it's Location since it is now relative to the picture box instead of the form. Like this:
public Form1() {
InitializeComponent();
var pos = label1.Parent.PointToScreen(label1.Location);
pos = pictureBox1.PointToClient(pos);
label1.Parent = pictureBox1;
label1.Location = pos;
label1.BackColor = Color.Transparent;
}
Looks like this at runtime:
Another approach is to solve the design-time problem. That just takes an attribute. Add a reference to System.Design and add a class to your project, paste this code:
using System.ComponentModel;
using System.Windows.Forms;
using System.Windows.Forms.Design; // Add reference to System.Design
[Designer(typeof(ParentControlDesigner))]
class PictureContainer : PictureBox {}
You can just use
label1.Parent = pictureBox1;
label1.BackColor = Color.Transparent; // You can also set this in the designer, as stated by ElDoRado1239
You can draw text using TextRenderer which will draw it without background:
private void pictureBox1_Paint(object sender, PaintEventArgs e)
{
TextRenderer.DrawText(e.Graphics,
overallpercent.ToString("#0") + "%",
this.Font,
new Point(10, 10),
Color.Red);
}
When overallpercent value changes, refresh pictureBox:
pictureBox1.Refresh();
You can also use Graphics.DrawString but TextRenderer.DrawText (using GDI) is faster than DrawString (GDI+)
Also look at another answer here and DrawText reference here
For easy for your design.
You can place your label inside a panel. and set background image of panel is what every image you want. set label background is transparent
After trying most of the provided solutions without success, the following worked for me:
label1.FlatStyle = FlatStyle.Standard
label1.Parent = pictureBox1
label1.BackColor = Color.Transparent
You most likely not putting the code in the load function. the objects aren't drawn yet if you put in the form initialize section hence nothing happens.
Once the objects are drawn then the load function runs and that will make the form transparents.
private void ScreenSaverForm_Load(object sender, EventArgs e)
{
label2.FlatStyle = FlatStyle.Standard;
label2.Parent = pictureBox1;
label2.BackColor = Color.Transparent;
}
One way which works for everything, but you need to handle the position, on resize, on move etc.. is using a transparent form:
Form form = new Form();
form.FormBorderStyle = FormBorderStyle.None;
form.BackColor = Color.Black;
form.TransparencyKey = Color.Black;
form.Owner = this;
form.Controls.Add(new Label() { Text = "Hello", Left = 0, Top = 0, Font = new Font(FontFamily.GenericSerif, 20), ForeColor = Color.White });
form.Show();
Using Visual Studio with Windows Form you may apply transparency to labels or other elements by adding using System.Drawing; into Form1.Designer.cs This way you will have Transparency available from the Properties panel ( in Appearance at BackColor ). Or just edit code in Designer.cs this.label1.BackColor = System.Drawing.Color.Transparent;

Changing text color in PdfSharp

I'm currently creating a PDF with PdfSharp which mostly consists of text and some images.
The text elements have different colors. My problem is that as soon as I use a different color than the color I started with, the text is not visible in the resulting PDF (e.g. I start with black text, switch to a red text, the red text is not visible). All text elements are in the resulting PDF (I can select them), but the red elements are invisible.
So here is the code:
// Create a new PDF document with one page
var document = new PdfDocument();
var page = document.AddPage();
page.Width = 800;
page.Height = 600;
var defaultFont = new XFont("Arial", 12, XFontStyle.Regular, new XPdfFontOptions(PdfFontEmbedding.Always));
var gfx = XGraphics.FromPdfPage(page);
// black text
gfx.DrawString("black", defaultFont, XBrushes.Black, new XRect(x, y, width, height), XStringFormats.Center);
// red text
gfx.DrawString("red", defaultFont, XBrushes.Red, new XRect(x2, y2, width2, height2), XStringFormats.Center);
I've already found a solution (re-creating the XGraphics object) but it's quiete messy because it needs to be called after each color change:
// ...
// black text
gfx.DrawString("black", defaultFont, XBrushes.Black, new XRect(x, y, width, height), XStringFormats.Center);
// disposing the old graphics context and creating a new one seems to help
gfx.Dispose();
gfx = XGraphics.FromPdfPage(page);
// red text
gfx.DrawString("red", defaultFont, XBrushes.Red, new XRect(x2, y2, width2, height2), XStringFormats.Center);
I guess there is a better solution, but I couldn't find one yet.
Edit
As suggested in this answer, I wanted to create a SSCCE. During the creation I found the actual bug. Instead of XBrushes.Red I used an own defined XBrush, but didn't mention it in the above code snippet, because I thought it was unnecessary.
As already mentioned in the last section of the question, I used an own defined brush instead of XBrushes.Red.
I defined it the following way:
XBrush redBrush = new XSolidBrush(new XColor {R = 207, G = 0, B = 44});
This way the brush only worked after I disposed the graphics object and created a new one. But after some googling I found the correct way to define a brush:
XBrush redBrush = new XSolidBrush(XColor.FromArgb(207, 0, 44));
I tried to replicate your problem using your code snippet and PDFsharp version 1.32. I used VS Express 2013 which automatically converted all projects to .NET 4.5.
I tried both builds (GDI+ and WPF) and all colours worked fine for me.
So instead of just a code snippet you should provide an SSCCE.
See also:
http://forum.pdfsharp.net/viewtopic.php?p=2094#p2094

VB.NET custom user control graphics rotation

this is my first question on here.
I'm trying to build a dial control as a custom user control in VB.NET. I'm using VS2008.
so far I have managed to rotate image using graphics.rotatetransform . however, this rotate everything. Now I have a Bitmap for the dial which should stay stable and another Bitmap for the needle which I need to rotate.
so far i've tried this:
Dim gL As Graphics = Graphics.FromImage(bmpLongNeedle)
gL.TranslateTransform(bmpLongNeedle.Width / 2, bmpLongNeedle.Height * 0.74)
gL.RotateTransform(angleLongNeedle)
gL.TranslateTransform(-bmpLongNeedle.Width / 2, -bmpLongNeedle.Height * 0.74)
gL.DrawImage(bmpLongNeedle, 0, 0)
As I understand it, the image of the needle should be rotated at angle "angleLongNeedle" although i'm placing the rotated image at 0,0. However, the result is that the Needle doesn't get drawn on the control.
any pointers as to where I might be going wrong or something else I should be doing?
Thanks in advance
First of all, why do you allocate the Graphics object from a bitmap that you then proceed to draw onto the graphics? That doesn’t make sense.
Dim gL As Graphics = Graphics.FromImage(bmpLongNeedle)
' … '
gL.DrawImage(bmpLongNeedle, 0, 0)
What you probably want is a graphics context for the whole image. You then apply the transformations to it and finally draw the bmpLongNeedle image.
Secondly, your translations look inversed: in the first step, you need to move the image to the origin (0, 0); then you rotate it, and then move it back. So the transformation should look like this:
gL.TranslateTransform(-bmpLongNeedle.Width * 0.5, -bmpLongNeedle.Height * 0.5)
gL.RotateTransform(angleLongNeedle)
gL.TranslateTransform(bmpLongNeedle.Width * 0.5, bmpLongNeedle.Height * 0.5)
Notice the inversed order of the TranslateTransforms. Also, why did you translate by 0.74 times the height, instead of half?
oh the bitmap for needle has the pivot point at 0.74 * height.
may be I should have posted this before. but this is what i've done.
Public Class Altimeter
Protected Overrides Sub OnPaint(ByVal e As System.Windows.Forms.PaintEventArgs)
Dim bmpBezel As New Bitmap("{path}\Altimeter_Background.bmp")
Dim bmpLongNeedle As New Bitmap("{path}\LongNeedle.bmp")
Dim rect2 As New Rectangle(e.ClipRectangle.X, e.ClipRectangle.Y, e.ClipRectangle.Width, e.ClipRectangle.Height)
'make transparent
bmpBezel.MakeTransparent(Color.Yellow)
bmpLongNeedle.MakeTransparent(Color.Yellow)
Dim angleLongNeedle As Single = (Altitude / 50) * 360
'draw bezel
e.Graphics.DrawImage(bmpBezel, rect2)
'rotate long needle
Dim gL As Graphics = Graphics.FromImage(bmpLongNeedle)
gL.TranslateTransform(bmpLongNeedle.Width / 2, bmpLongNeedle.Height * 0.74)
gL.RotateTransform(angleLongNeedle)
gL.TranslateTransform(-bmpLongNeedle.Width / 2, -bmpLongNeedle.Height * 0.74)
gL.DrawImage(bmpLongNeedle, 0, 0)
MyBase.OnPaint(e)
End Sub
i use e.graphics.drawimage to paint the whole image. i don't really understand what you said about having graphics object for all the images and then drawing the needle? do you have any pseudo code?
thanks