You know sometime someone tells you about something, and you can tell there is a whole lot more to it than they are telling you about. Well, signature capture for Windows Mobile is one of those things. It’s really not bad today and you can do it in one sitting easily now. But there was a time, when if your life depending on it you might be able to get it right. At least we have managed code now. A few of us attempted to do this feat in embedded Visual Basic years ago and I’m surprised it didn’t cost us our sanity. Oh the humanity…

You could do it you just had to copy each color pixel by pixel and save it into a bitmap, and that was a challenge too. And GetPixel() had to be the slowest function call ever. It took at least a second. No way, you were going to give someone a full screen to put there signature.

That was then, this is now…

Mobile Signature

Office 2007 might have 2007 features in it. And it works for Office 2007, well to a point. But with Windows Mobile applications less is more. Don’t get me wrong I really do think Mobile Signature would make a great feature in a more complete application. But as far as the feature of taking a signature on a mobile device this is a great approach.

Also note that Mobile Signature could be easily adapted into a drawing application, and so on, especially for kids.

Let’s talk about UI first. Notice how much space is dedicated to taking the user’s signature. This is important; I’ve seen almost the reverse before and that just isn’t very usable. I took a little extra time and care to make sure all control had a black border around them,expect the black color square. It has a gray border.

One thing to note is a wanted the user to be able to tell what color they would be writing in without having to draw on the screen. This is accomplished by having the borders around the active color flash on and off. This is a great visual effect that was easy to implement with a timer. We track the currently active color in a form level variable, and on the timer tick event, which happens every 500 ms, we toggle the visibility of the border around the active color. Works great! Check it out!

The menu is another area that is simple but you can learn from it. Save is very important to us, so it is prominent and has it own hardware button that can cause it to occur. On the menu we have an option for clearing the screen, showing the about form, and exiting the application. But we also have a menu option to change the size of the line we are drawing with. It can be set from any of the following: 1 pixel, 3 pixels, 5 pixels.

The core of the application is the code that actually draws the lines on the screen. Here it is:

   1: private void pictureBox_MouseMove(object sender, MouseEventArgs e)

   2: {

   3:     if (pen.Color != signatureColor)

   4:         pen = new Pen(signatureColor);

   5:  

   6:     if (pen.Width != width)

   7:         pen.Width = width;

   8:  

   9:     x1 = x2;

  10:     y1 = y2;

  11:     x2 = e.X;

  12:     y2 = e.Y;

  13:  

  14:     if (x1 == -1 && y1 == -1)

  15:         return;

  16:  

  17:     pictureBoxSignature.CreateGraphics().DrawLine(pen, x1, y1, x2, y2);

  18: }

One area of code that is worth checking out is the code to save the bitmap of the signature. It’s pretty advanced and powerful.

   1: // P/Invoke declaration

   2: [DllImport("coredll.dll")]

   3: public static extern int BitBlt(IntPtr hdcDest, int nXDest, int nYDest, int nWidth, int nHeight, IntPtr hdcSrc, int nXSrc, int nYSrc, uint dwRop);

   4:  

   5: const int SRCCOPY = 0x00CC0020;

   6:  

   7: private void Save(string filename, Graphics gx, Rectangle rect)

   8: {

   9:     Bitmap bmp = new Bitmap(rect.Width, rect.Height);

  10:     // Create compatible graphics

  11:     Graphics gxComp = Graphics.FromImage(bmp);

  12:     // Blit the image data

  13:     BitBlt(gxComp.GetHdc(), 0, 0, rect.Width, rect.Height, gx.GetHdc(), rect.Left, rect.Top, SRCCOPY);

  14:     bmp.Save(filename, System.Drawing.Imaging.ImageFormat.Bmp);

  15:     // Cleanup

  16:     bmp.Dispose();

  17:     gxComp.Dispose();

  18: }

Everything else is pretty straight forward, but check it out and see what you think!

Download executable: mobileSignature.cab

Download Source Code: mobileSignature.zip

Feedback

So, how do you guys feel about line of business applications? Do you want more days that focus on line of business application topics? or less? Let me know! :D Tomorrow will be here before you know it.