Create Form fade out transition - c#

How could you - in WinForms - create a black area that (over time) loses/gains transparency and is redrawn constantly so a kind of transition is created? I dont want to create a seperate form, so this would be very helpful and I could rearrange my new items as soon as the black area reaches a transparency of 0.
Left: What i have what at the moment:
Right: What the program looks like on startup
What I would want: A totally black screen

Override the OnPaint method of the form, and fill a rectangle the size of the form with the desired transparency. In this example, transparency keeps increasing:
var transparency = 0;
protected override OnPaint(PaintEventArgs e)
{
base.OnPaint(e);
// e.Graphics.DrawImage(Image, imageLeft, imageTop, imageWidth, imageHeight);
e.Graphics.FillRectangle(new SolidBrush(Color.FromArgb(transparency, Black)), this.ClientRectangle);
}
If you want to do this from a Timer event, inside the Tick event Invalidate the form to force the paint.
protected void MyTimer_Tick(object sender, eventArgs e) {
transparency++;
MyForm.Invalidate();
}
If you need to draw on top of the PictureBox, that presents a problem. One way to solve it is to get rid of the PictureBox and draw the image using Graphics.DrawImage before you draw the fade. If you want to show the image but have the black go up against the edges of your animal, then make it's background color of the PictureBox transparent and convert your image to use a PNG or GIF with all around the animal transparent in the original image.
For more complex effects, Check out the dot-net-transitions project on Google Code. It supports a variety of linear/non-linear transitions.

Related

PictureBox background equal to other PictureBox while moving?

C# Beginner here.
I'm making a 2D Tanks game, and everything's working out nicely so far.
Both of my tanks are Picture Boxes, and so is my Missile.
The image of the missile and tanks in the PictureBoxes have transparent BackColour properties. The problem is, the background of the missile & tanks are not transparent while on top of the other picturebox (pbBackground). It looks like this.
I'm aware that using different PB's is an inefficient way of going about it, but I've come pretty far and I don't really know any better. Anyways, as you can see, the Missile and Tank PB backgrounds show the form colour. When I downloaded the images, the backgrounds were transparent, I'm sure of it. How do I go about making the background of my PB's truly transparent? (Matching the background of the Overlapped PB?)
I saw this but it doesn't really match my scenario and I don't understand the solution.
UPDATE: Okay, I followed Tommy's advice, is this the right way to go about moving it along pbBackground in a timer constantly changing MissileX and MissileY? Currently this does nothing.
using (Graphics drawmissile = Graphics.FromImage(pbBackground.Image))
{
drawmissile.DrawImage(pbMissile.Image, new Point(MissileX,Convert.ToInt32(MissileY)));
}
PictureBox is opaque. And PictureBox is not efficient.
For making games, you should study Paint event which directly draws on your form.
Bitmap backgroundBitmap = new Bitmap("background");
Bitmap tankBitmap = new Bitmap("tank");
private void Form1_Paint(object sender, PaintEventArgs e)
{
e.Graphics.DrawImage(backgroundBitmap, 0, 0);
e.Graphics.DrawImage(tankBitmap, 30, 30);
}
private void timer1_Tick(object sender, EventArgs e)
{
this.Invalidate(); //trigger Form1_Paint to draw next frame
}
Don't layer multiple PictureBox instances on top of each other. It will get very confusing, very quickly.
Instead, use one single PictureBox and use Paint to draw your images to it. In this way, you can have much more control over the graphics operations happening.
Have a look at this
private void DrawIt()
{
System.Drawing.Graphics graphics = this.CreateGraphics();
System.Drawing.Rectangle rectangle = new System.Drawing.Rectangle(
50, 50, 150, 150);
graphics.DrawEllipse(System.Drawing.Pens.Black, rectangle);
graphics.DrawRectangle(System.Drawing.Pens.Red, rectangle);
}
In this example they demonstrate how to draw shapes directly onto a Form. You would use your PictureBox there instead. You can also draw images.
There's lots of ways to draw shapes onto a form using a System.Drawing.Graphics object. Try taking a look at this question for a comparison.
Tommy's answer is right, however, if you're dead set on using pictureboxes (a bad idea), set the overlapping picturebox backgroundcolour to Transparent and the Form's Background to whatever image. TIL the Transparent BackColour just uses the form colour / image. Tommy actually has the right answer here, but this is what I did to fix my problem (the lazy way).

How can I get the transparency right when layering pictureboxes?

In my setup i have 5 pictureboxes which I am trying to layer.
My code for this is:
pbCoin1.Parent = pbMap;
pbCoin1.BackColor = Color.Transparent;
pbCoin2.Parent = pbMap;
pbCoin2.BackColor = Color.Transparent;
pbCoin3.Parent = pbMap;
pbCoin3.BackColor = Color.Transparent;
pbFlashlight.Parent = pbMap;
pbFlashlight.BackColor = Color.Transparent;`
All 5 pictureboxes contain images. The method I am using works fine, but the problem is that the PbCoin 1,2,3 are glitching trough my pbFLashlight(see image).
Can someone provide a solution such that the coins are only visible when the transparent part of the black layer is over it?
Don't use multiple picture boxes. Use a single PictureBox to represent the game area and handle the .Paint event. Do all of your drawing using GDI calls on the Graphics reference that .Paint sends you in e. You will want to call PictureBox.Invalidate at the end of the Paint event to cause it to queue up the next frame
For better performance, create a new Bitmap instance that you keep a reference to for the life of the game. Clear and do all your drawing to that bitmap every frame, then draw that bitmap to the PictureBox in .Paint.
For even better performance than that, don't use WinForms.
The basic pattern should look like this:
private void Canvas_Paint(object sender, PaintEventArgs e)
{
e.Graphics.DrawImage(...);
Canvas.Invalidate();
}

c# Override high-contrast for background image

I wasn't able to find an answer for this:
I have a background image on my form that I want to remain visible even when the system is on High Contrast mode. Is there code that can be entered that overrides the HC mode?
I've tried this on the Form Load event but no luck- no definition for graphics. (Not sure this would even be a viable solution):
OnPaint: e.Graphics.DrawImage(new Bitmap(BackgroundImage), 0, 0);
Aside from creating a PictureBox across my form and putting the image that way, does anyone know of a way to show the BG image of the form always?
Override the OnPaintBackground method:
protected override void OnPaintBackground(PaintEventArgs e)
{
e.Graphics.DrawImage(new Bitmap(BackgroundImage), e.ClipRectangle);
}
This DrawImage overload will stretch the image to fit the rectangle. If the ClipRectangle doesn't work (sorry, I can't test this right now!), create a new Rectangle with the background dimensions

How to fix a rectangle to the borders of the form

I think I'm not clear, but I am practicing doing some pictures on a form. It's very simple code so I think it's not worth it to post it.
I want to draw some semi-transparent rectangles close to the borders of the form, which I have already managed to do. The problem is that when I re-size the form the rectangles just stay at their original positions, and don't "follow" the new position of the borders.
Make sure to do your drawing in the form's Paint event. That way, it will happen each time the control is redrawn: on a resize for example.
Here's a good example: http://msdn.microsoft.com/en-us/library/system.windows.forms.control.paint.aspx
public MyForm()
{
this.Paint += this.PaintRectangles;
}
private void PaintRectangles(object sender, PaintEventArgs e)
{
// use e.Graphics to draw stuff
}

exclude a part of an image by taking color

My problem is quite simple, but I can't deal with it. I have a yin-yang.jpg file and I'd like to get only round shape (without rest of rectangle, which should be not clickable) and what is more whole white color change to red one and parts with black color should be excluded from an image as well (not clickable).
That image will be background of my form, which I'd like to show at the start of an application.
private void hello_form_Paint(object sender, PaintEventArgs e)
{
Form f = (Form)sender;
f.BackgroundImage = global::TicTacToe.Properties.Resources.ying_yang1;
GraphicsPath formPath = new GraphicsPath();
Rectangle newRectangle = f.ClientRectangle;
e.Graphics.DrawEllipse(System.Drawing.Pens.Black, newRectangle);
newRectangle.Inflate(-5, -5);
formPath.AddEllipse(newRectangle);
f.Region = new Region(formPath);
}
Paint event on my form which I show makes them round, but it's not all things I have to do. How to exclude a black part from a background and how to change white part into red one?
Given what you've described you may find:
http://msdn.microsoft.com/en-us/library/system.drawing.bitmap.maketransparent(v=vs.71).aspx
Bitmap.MakeTransparent() a useful method to explore, it allows you to turn a given colour in your image transparent.
If you use a file with transparent background like a .png or .gif you should be able to only see the round yin-yang shape when you set it as form background.
You can easily edit a .jpg with i.e. GIMP or Photoshop to make the rectangle transparent outside the circle.
edit: is this what you are trying to do?

Categories