I hope you can help me with this problem, attached videos to explain in a simpler way.
First example
Panel (has a textured background) with labels (the labels have a png image without background)
Events: MouseDown, MouseUp and MouseMove.
As you will notice in the video to drag the label the background turns white panel and regains its background image when I stop dragging the label
Panel controls have a transparent background as property, but changing the background with any color, let the problem occurred related to the substance, I do not understand why this happens and how to fix less.
Second Example
Contains the above, with the only difference that the panel controls instead of having transparent background, I chose black color for that property
You have to use double buffer and you don't have to stop using an image on the background, you can have everything running smoothly.
You have a couple of ways to do this, the fast way (not enough most of the time) is to enable doublebuffer of the panel.
The "slow" but better way is to do your own Double Buffer using a Bitmap object as a buffer.
This example creates a "side buffer" and accepts an image as parameter and draws it using created buffer.
public void DrawSomething(Graphics graphics, Bitmap yourimage)
{
Graphics g;
Bitmap buffer = new Bitmap(yourimage.Width, yourimage.Height, graphics);
g = Graphics.FromImage(buffer);
g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;
g.DrawImage(yourimage, 0, 0);
graphics.DrawImage(buffer, 0, 0);
g.Dispose();
}
Call this on your OnPaint event.
BTW... this is just a double buffer example.
Cheers
Change DoubleBuffered to true for both form and panel. I think that should solve your problem.
this is totally normal, because System.Windows.Forms.Control based items were not designed to do this kind of advanced Graphics operations.
in fact the reason that this effect happens here, is that when you assign any value other than 255 to the alpha component of a control BackColor, the form does the following when you change the control size or position:
it sets the new control position
it redraws the parent control
it gets the background of the control's parent as an image
it draws acquired image into the control body to seem as if the control is transparent
the control body gets drawn on top of the previously drawn background
the control children are drawn
* this is is a simplified explanation for the sake of illustration to deliver the idea
steps 1, 2 are responsible for the flickering effect that you see.
but you have two ways to solve this,
-the first is some kinda advanced solution but it's very powerful, which is you would have to create a double buffered custom control that would be your viewport.
the second is to use WPF instead of windows forms, as WPF was designed exactly to do this kind of things.
if you can kindly provide some code, i can show you how to do both.
Related
I am having a difficult time finding details on the draw order of a DirectX 11 application when rendered in a Windows Form. I know that I can assign my SwapChain to render to the handler of a control (such as a panel) which I have done already. The question here is more focused on being able to paint over the content that is rendered via DirectX in the same control. I already know that I can add controls to the panel and they will paint over the rendered content. I attempted utilizing the Paint event for the panel and doing a simple draw:
private void panel1_Paint(object sender, PaintEventArgs e) {
using (Pen p = new Pen(Brushes.Red))
e.Graphics.FillEllipse(p, new Rectangle(0, 0, 250, 250));
}
However, I believe this is painting the requested content below the scene content rendered by DirectX. I haven't been able to find any details on the draw order and which events to utilize. If anyone has any ideas on which events to use to paint over the rendered scene, that would be helpful. If controls can be rendered on top of the scene, then I would like to believe custom painting could be achieved as well.
Maybe I'll have to go the long way around?
Update
I have found a post over on MSDN that doesn't fully answer the question at hand, but helps with my comprehension, and also sheds light on an alternate route which appears to require being done at the end of the render method for my engine (which makes sense seeing as rendering typically follows a FIFO system).
You can have GDI(+) calls on top of a DX render. The d3d device can
return a Graphics g suitable to do gdi calls. At least, I've done it
in windowed mode.
Microsoft.DirectX.Direct3D.Surface bb = device.GetBackBuffer(0, 0);
System.Drawing.Graphics g = bb.GetGraphics();
g.DrawRectangle(...); // or whatever
bb.ReleaseGraphics();
bb.Dispose();
Also, I don't see what's to stop somebody from adding controls to the
panel one uses as the DX panel.
Clarified Question
My original question however, still remains. Does anyone know what the draw order is between Windows Forms and DirectX 11? Does anyone know of an event that can be utilized as part of this order to draw on top of the rendered content?
So my application runs in fixed size window and in full screen. The problem I'm facing is how to properly scale the current contents of the panel (which depend on the application use) when the window is resized. This is my current code:
private void Form1_ClientSizeChanged(object sender, EventArgs e)
{
System.Drawing.Drawing2D.Matrix transformMatrix = new System.Drawing.Drawing2D.Matrix();
float px = panel2.Width;
float py = panel2.Height;
panel2.Width = this.Width / 2;
panel2.Height = panel2.Width;
panel2.Location = new Point(this.Width - panel2.Width - 30, 30);
transformMatrix.Scale(panel2.Width / px, panel2.Height / py);
panel2.Region.Transform(transformMatrix);
//Rest of the code
}
But the drawn content doesn't scale, and if I use Invalidate() or Refresh() the drawn content gets cleared (the panel is redrawn empty). What am I missing?
.NET doesn't remember what's drawn on the panel, as simple as that. As soon as anything invalidates the windows bitmap buffer (causing a WM_PAINT), it's going to be repainted again. So, you have to draw what you want to draw using the Paint event (or overriding OnPaint).
However, there is another way that might be easier to implement - don't paint into a Panel. Instead, paint into a PictureBox (or rather, a Bitmap assigned to the Image property of the PictureBox). The Bitmap will be reused when invalidating (and redrawing) the picture box, so nothing will be lost. By using PictureBox.ScaleMode, you can define how you want the picture box to scale the bitmap, and it will do so as well as it can.
In any case, transforming the Region property doesn't do anything useful - you're simply changing the region, not doing anything to the drawing itself. To use 2D transformation matrices, you want to apply them on a Graphics object during the drawing (in Paint handler or OnPaint override) - drawing anything on the Graphics object will then transform everything you're trying to draw, which in your case means scaling the painting.
So you have to decide: do you want to just scale a stored bitmap with the painted image, or do you want to redraw it all from scratch (which also means you can pick any level of detail you can provide)?
I think that you're mistaking what the Region property is meant for. According to the MSDN docs (empasis mine, replace 'window' with 'control' when reading):
The window region is a collection of pixels within the window where the operating system permits drawing. The operating system does not display any portion of a window that lies outside of the window region. The coordinates of a control's region are relative to the upper-left corner of the control, not the client area of the control.
All that you're doing is changing the region that the OS will allow painting, which explains why you're not seeing anything. I think that you should be resizing the control when the form is resized, either through Anchor, or through my preference of Dock with several controls, or a panel like TableLayoutPanel where it will handle scaling and relative sizing for you.
Thank you for your answers, but I wrote my own function and logic that serves the purpose for this application. Basically the function checks for the state of the application variables, and calls the appropriate function that originally drew the content, and since those functions use the panel width and height as arguments they properly scale the drawn content and retain the drawing composition.
P.S. I'll accept Luaan's answers since it offers a valid alternative and is complete.
I'm trying to build my own custom control for a windows forms application in C#.Net. Currently I paint some rectangles and other graphic elements using the paint event.
When I now resize the app form to fit the desktop size, all elements are repainted (which is exactly the behaviour I need) but the old one's are shown in the background.
Here's what I'm doing by now:
Pen penDefaultBorder = new Pen(Color.Wheat, 1);
int margin = 5;
private void CustomControl_Paint(object sender, PaintEventArgs e) {
CustomControl calendar = (CustomControl)sender;
Graphics graphics = e.Graphics;
graphics.Clear(Color.WhiteSmoke);
graphics.DrawRectangle(penDefaultBorder, margin, margin, calendar.Width - margin * 2, calendar.Height - margin * 2);
//...
}
Neither the graphics.Clear, nor adding a graphics.FillRectangle(...) will hide the old rectangle from the surface.
Ideas? Thank you all.
Paint events usually don't request an update for the entire canvas, just the area specified in the PaintEventArgs. I'm guessing what's happening is that only the newly-exposed regions of the canvas are being passed in the PaintEventArgs.
This one of the reasons that you shouldn't do any rendering in the Paint event. You should render to an offscreen bitmap - a buffer - and copy from that buffer to the control's canvas in the Paint event.
Searching for "double buffering" here or on Google will give you many examples of the technique.
Have you tried .Invalidate() to cause the form to redraw?
I would like to have a form in which the controls on the form are fully visible but the form itself is invisible. If I change the form's Opacity, this makes both the form and the controls on it semi-transparent, so this doesn't work.
I can't do this by setting the form's TransparencyKey, since I have a PictureBox on the form. If the image in the PictureBox happens to contain pixels that match the TransparencyKey, they appear as openings in the form, which I don't want.
TransparencyKey is the only way to get this. Pick the right color. Color.Fuchsia has a long tradition of being the color of choice, going back to the early days of Win32 development. Assault your eye with it to see its merits.
With the caveat that I've never used it, just ran across it once, thought "neat!" and moved on...
Look into System.Drawing.Drawing2D.GraphicsPath and setting the form's Region property. I added two buttons to the basic Windows forms application:
public Form1()
{
InitializeComponent();
Rectangle r1 = new Rectangle(button1.Location, button1.Size);
Rectangle r2 = new Rectangle(button2.Location, button2.Size);
GraphicsPath gp = new GraphicsPath();
gp.AddRectangle(r1);
gp.AddRectangle(r2);
this.Region = new Region(gp);
}
I've approximated the shape of the button with a rectangle; with this code, you can see the form background color at the buttons' corners. You'll need to work out the enclosing path for each of your controls and add them to the path individually. You'll need to take into account any offset introduced by the form title bar or border style.
Update: I did some investigation and have a couple of possible approaches for the problem:
Using the GraphicsPath method, set pictureBox.Visible to False if there is no image loaded.
When you load an image into the picture box, analyze the image to get a list of all the colors in it, then randomly generate one that isn't. Set the form's BackColor and TransparencyKey properties to match this new color, Hans Passant's answer.
It's a little hard to explain what I need but i'll try:
I need to write application (winform) which will be some kind of filter to image/other forms behind it. With one exception - all behind form should looks as is except of red (for example) color, which have to be replaced to any other specified color, white for example.
So let's imagine I have opened windows Word with few lines of text. With red and black letters.
So when i place my application above this text - it should "filter" red symbols and fill them to white.
So as i understand this task: i have to snap area behind the form, then process it (replace colors) and after draw this image on my form body.
Any links or keywords for solution?
UPD:
so - this is my final solution:
do form transparent (using TransparencyKey and BackColor properties)
place picturebox over the form
when we need to update image in picturebox - we replace current image with pictureBox1.Image = null;, then refreshing form with (this.Refresh()) and do new snapshot
thanks for all ;-)
UPD 2:
sample http://dl.dropbox.com/u/4486681/result.png
UPD 3:
here are sources
you can create a snapshot of the desktop using the following code:
public Bitmap CaptureScreen()
{
Bitmap b = new Bitmap(SystemInformation.VirtualScreen.Width, SystemInformation.VirtualScreen.Height);
Graphics g = Graphics.FromImage(b);
g.CopyFromScreen(0, 0, 0, 0, b.Size);
g.Dispose();
return b;
}
Replace the dimensions and position with the coordinates of your form. This way you get a bitmap of what's behind your form. Then you can do the color replacement on that bitmap.
Please note that due to settings like ClearType and other anti-aliasing mechanisms, you have to also take into account "intermediate pixels" when doing the color replacement. Otherwise things will look funny :-)
I don't know if this can be done at all (let's see what others answer :-).
You can get a handle to the screen device context, which gives you a bitmap of the screen.
HDC dc = GetDC(NULL);
(This is C++, you'll have to use P/Invoke, or create a mixed-mode library in C++)
Then you can redraw a region of the screen with your filtering process.
Now the problems start:
how do you know that the pixels in your interesting region has changed ?
if the region changes, are the changes visible or are they hidden by your own drawing.
You could have a button somewhere that hides your own app momentarily and shows it back when re-pressed, and filters the new content.
Good luck. Any possibility of sharing the user scenario ?