[C#] how do I draw multiple images without flickering?

Question

0.00/5 (No votes)

See more:

I'm making a strategy game in C# (nothing too wild, no animations or action). I managed to draw a section of the map and allow the user to scroll it, using DrawImage and specify a region of the map image to draw:

RectangleF srcRect = new RectangleF(currentMapX, currentMapY, 500, 500);
mapSectionGraphics.DrawImage(mapImage, 0, 0, srcRect, GraphicsUnit.Pixel);

Now, when I scroll the map it works fine, but when I draw additional images onto the map, they flicker when scrolling.
Ideally, I guess, I would draw the entire map with all objects on it into one PictureBox, and then take a section from that compound image to draw in the map navigation screen. This eliminates flickering as the map does not need to constantly build back up while scrolling.

My question is... how do I do this? I'm still learning the ropes in C#, so I hope something like this can be done in a not too complicated way. Thanks!

What I have tried:

As far as I can see I can only use DrawImage to draw actual "Image" resources of PictureBoxes, and not the actual result of several drawing operations.

I did find a piece of code that allows copying the result and drawing it into another PictureBox, and that worked well, but for this the source (in my case the full map) needs to be visible on the screen as well, which I don't want.

Posted 19-Oct-20 3:43am

Member 14846576

Updated 19-Oct-20 3:49am

Add a Solution

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

OriginalGriff · Answer 1 · 2020-10-19T03:49:00

Solution 1

You can try setting the form DoubleBuffered property to true: Control.DoubleBuffered Property (System.Windows.Forms) | Microsoft Docs[^] and see if that improves it, but the best solution is not to use a PictureBox at all. Instead, put a Panel on the form, and handle it's Paint event to draw the images yourself, using the Graphics.DrawImage method[^] on the Graphics object supplied in the event args.
In the long run, it's a much more flexible solution (and not as complicated as it sounds).

Posted 19-Oct-20 3:49am

OriginalGriff

Comments

Member 14846576 19-Oct-20 10:33am

Thanks for your answer. How would I do this? I see the Paint event in the Panel, but I'm unsure how to proceed..

OriginalGriff 19-Oct-20 11:02am

Follow the links I gave you - it's not complicated!

Member 14846576 19-Oct-20 12:47pm

Thanks, I see, I now did it the way it was written there. Unfortunately, it still flickers when I use .Refresh() or .Invalidate() while scrolling to raise the Paint event.. seems I'm still doing something wrong..