Welcome to MSDN Blogs Sign in | Join | Help

Alex Yakhnin's Blog

Development and architecture for Windows Mobile devices. And a few useful tips on the way...

News

Dimming the background.

I've received a question from the customer the other day asking me how he can implement functionality of "dimming" background effect when a message box is shown in his Windows Mobile application. In fact it should be pretty easy to do utilizing the DrawAlpha method from the GraphicsExtender class that I showed you in this webcast. Take a look at the following code snippet:

protected override void OnPaint(PaintEventArgs e)

{

      // Create a temp bitmap

      Bitmap dimBackGround = new Bitmap(this.Width, this.Height);

      Graphics gxTemp = Graphics.FromImage(dimBackGround);

      // Color it black

      gxTemp.Clear(Color.Black);

      // Draw it with alpha transparency

      e.Graphics.DrawAlpha(dimBackGround, 100, 0, 0);

      // Clean up

      gxTemp.Dispose();

      dimBackGround.Dispose();               

 }  

The code above shows OnPaint override method in the BackgroundForm class that I've added to the demo project. I've set the FormBorderStyle to None and WindowState to Maximized for this from to make it full screen.

So, now before displaying a message box you will need to show the BackroundForm:

  BackgroundForm form = new BackgroundForm();

  form.Show();

  MessageBox.Show(txtMessage.Text);

  form.Close();

And here's the result:

Download the sample code from here.

Posted: Tuesday, March 31, 2009 3:00 PM by priozersk
Filed under:

Attachment(s): DimmingBackgroundTest.zip

Comments

aymanfm said:

Hi Alex,

Thanks for this great sample. I was looking for such a thing. I think there's a small bug in the code, when the messagebox is shown and you try to move it, it leaves a copy of it on the background.. it happens every time you do move the messagebox, I think the background form should be redrawn?

Thanks,

a.

# April 4, 2009 5:25 AM

Vijay_Visana said:

Thanks for the fantastic article.

I am trying to gradually dim the background by decreasing transparency of black backround image in several steps in OnPaint. while also drawing  sliding menu poping up from bottom but it makes code very slow and I donot get smooth and slick movment for sliding menu. Any idea.

# May 1, 2009 6:45 AM

priozersk said:

You may need to use double-buffering to reduce flickering.

# May 2, 2009 7:27 PM

ChristopherFairbairn said:

Hi Alex,

I know this is a kind of loaded question... but do you know of a way to resolve the issues caused by not repainting the background (i.e. the message box drag and drop issue highlighted by a previous commenter)?

I've improved that situation in the past by having the background form take a screenshot of the device beforing becomming visible. Then rather than ignoring OnEraseBackground I've made it blit the stored screenshot and alpha blended it for the disabled look.

This improves the issue, as popping up the start menu, or moving the message box doesn't cause screen artifacts, but it is still less than ideal.

For example it doesn't fix the problem if the user rotates the screen (where the screenshot becomes the wrong shape etc).

I've tried various techniques to detect screen orientation changes and then temporarily disable the dimmed form in order to take an updated screenshot. However all techniques I've thought of so far have lead to unsightly flicker which has lead me to drop the idea.

I'd really love to work on finding a solution to this, given the current GDI / Win32 windowing constraints. Do you have any thoughts on possible approaches?

# May 7, 2009 7:16 PM
Anonymous comments are disabled
Page view tracker