Click here to Skip to main content
15,881,709 members
Articles / Mobile Apps / Windows Mobile

A Color Dialog for Windows Mobile 5

Rate me:
Please Sign up or sign in to vote.
3.89/5 (4 votes)
27 Nov 2008CPOL2 min read 25.8K   220   14   1
A color dialog using alpha blending for Pocket PC.

Introduction

I was going to make a color dialog for one of my professional projects, but the feature was not needed and I only got a glimpse of how I thought a color dialog should be. I wanted a hue-based palette and wondered why I couldn't find any decent free color dialog on the net. Maybe it was because I didn't Google enough or maybe it was because of the inherent complexity in transparence on the mobile platform.

I found some clues however:

Alphablending came from Chris Lortons excellent blog.

The HSL-class is objectified from the sample code made by the Irish people at geekymonkey. I was astounded to get different results from different HSL-RGB converters. This one did the work.

The color dialog is not perfect. There are still some subtle hue slides (probably because of the limited color range on a mobile when you use the palette). Also, there may be other bugs and the graphic design could have been better (not my strongest side), but it should be a good starting point. It is made for 240 * 300 in resolution and some control position values are hardcoded when you move to a horizontal view. (I would have liked a view-panel where you could have moved and arranged controls depending on resolution and orientation). So, that was for getting my back free... ;)

Using the Code

You start the dialog from the test form. It exposes the public properties (caption, frontcolor and behindcolor) and let's you start the dialog.

In the dialog you can change color by clicking on the big hue-palette, by clicking on the RGB stripe, or the monochromic stripe, or by changing value in the RGB boxes. The front and behind color can be swapped by clicking on the corresponding controls in the dialog.

Color input from the palette and the stripes are made by simple GetPixel calls. The palette is made up by getting the current hue from the RGB value of the current color. When we have that we overlay it with an image combined from a horizontal white to transparent, and a vertical black to transparent. Getting color from the palette should, in theory, not change the hue.

C#
private void Picker_Paint(object sender, PaintEventArgs e)
{
    if (m_backBuffer != null)
    {
        using (Graphics g = Graphics.FromImage(m_backBuffer))
        {

            g.Clear(this.BackColor);
            IntPtr hdcDest = g.GetHdc();
            if (m_isFore)
            {
                m_hsl.ColorValue = m_FrontColor;
            }
            else
            {
                m_hsl.ColorValue = m_BehindColor;
            }
            m_hsl.Saturation = 1;
            m_hsl.Level = 0.5;
            g.FillRectangle(new SolidBrush(m_hsl.ColorValue), m_paletteRectangle);

            Rectangle plotRect = new Rectangle(m_paletteRectangle.X,
                m_paletteRectangle.Y, m_paletteRectangle.Width + m_paletteRectangle.X,
                m_paletteRectangle.Height + m_paletteRectangle.Y);
            m_imagingImage.Draw(hdcDest, ref plotRect, IntPtr.Zero);
            g.ReleaseHdc(hdcDest);
        }
        e.Graphics.DrawImage(m_backBuffer, 0, 0);
    }
    else
        e.Graphics.Clear(this.BackColor);
    frontPictureBox.BackColor = m_FrontColor;
    backPictureBox.BackColor = m_BehindColor;
}

Overlaying the image is done in the Picker_Paint, declarations of functions in IImagingFactory and HSL conversion in the file conveniently called HSL.

History

2008-11-25 First version released.

License

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


Written By
Software Developer (Senior) Know It
Sweden Sweden
Currently employed at Know it, Stockholm, Sweden working with mobile solutions.

Comments and Discussions

 
Generalhey Pin
Ian xie18-May-09 20:17
Ian xie18-May-09 20:17 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.