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.

I mentioned to the group that I would post the Prize Picker application we wrote together on my blog as part of my 30 Days of .NET series. I think this was an awesome idea, and it looked like everyone really enjoyed themselves. Hopefully, a few of them will see this post and share their thoughts as well. It was very nice to have a hands on type presentation that everyone got to participate in together. And since only one person was “driving” we didn’t have to stop and fix a disconnected monitor. Ok, we did one time, but just one time.  

Big thanks to everyone that came out and participated! Page Brooks, Donny Craft, Benton Little, , Jamey McElveen , Shawn Morris, and Thad Smith. It was a lot of fun!

Prize Picker

There is probably someone out there who doesn’t think this is the best looking application ever. Well, you’re right! It’s not, but we didn’t really focus on that any until we had a fully functional application. At that point it was time to pick prizes for the lucky hopefuls that became winners at the event.

The only big item we didn’t implement, was an item that came up right at the end, we wanted to show the last winner in the area down at the bottom of the screen in big blog letters. And we wanted to rotate through remaining hopefuls and then finally pick a winner moving them to the winners table.

The application is a firm believer of the KISS principle. We did the entire application in about an hour and a half. And that is including some refactorings, and changes we made along the way. I’m pretty happy with the application, and will love it once we have the “Jackpot” style UI element added.

We added validation as we needed it, and decided to keep the applications logic in the UI, as hard as it was for us to do, to in this case to follow our KISS guidelines.

We have used RNGCryptoServiceProvider class already in the Pocket PasswordGen application on day six. This class makes sure that our random numbers are statistically random and not pretend watered down random.

   1: Byte[] randomBytes = new byte[4];

   2:  

   3: RNGCryptoServiceProvider rng = new RNGCryptoServiceProvider();

   4: rng.GetBytes(randomBytes);

   5:  

   6: // Convert 4 bytes into a 32-bit integer value.

   7: int seed = (randomBytes[0] & 0x7f) << 24 |

   8:             randomBytes[1] << 16 |

   9:             randomBytes[2] << 8 |

  10:             randomBytes[3];

  11:  

  12: int pick = seed % listViewHopefuls.Items.Count;

Download executable: prizePicker.cab

Download Source Code: prizePicker.zip

Feedback

The cool thing is we used this application to actually pick the winners for the prizes, and everything went great. So our intention is to keep using it from now. We are also going to post it on CodePlex soon and allow others to work on it as well.

Wow, today was a busy day. I gave a Windows Mobile Programming presentation today at a .NET user group I help run, PDANUG. I changed it up at the very last minute, and instead of doing the presentation I was planing on doing we wrote a Windows Mobile application together. It was great. I think everyone contributed, and got something out of it. In the end we had a very nice Prize Picker application that we will be able to use again and again in the future. And I have a new talk that I can present. Any takers?

What is My IP?

You may have seen sites like WhatIsMyIP.com, IPChicken.com, and my favorite IPCow.com. Most people prefer command prompt and good ole IPConfig. But sometimes when you are troubleshooting an issue with a friend of family member over the phone that’s not always the best idea. Usually in those kind of situations it is easier to send someone to a Web site and just have them read the value to you. I think some of the sites above will render appropriately on a mobile device, pretty sure IPCow.com does.

But what if you can’t connect to the Internet, and you need to see your Intranet IP address. In this case, and many others, one wants something a little more direct, and clear.

For this reason, “What is My IP?” exists. It couldn’t be simpler. Run the program, then see your IP address, or IP addresses in case you have multiple connections open. Which is very possible with today’s devices, with everything from Bluetooth, cellular connections, wireless connections, and more.

This application only does one thing, so it needs to do it very well. And it needs to be appealing in how it looks and how it does it.

Since the application has minimal features, it has a minimalist style to it. There is only one focus point of attention and that is the large network icon in the center of the screen. Everything else is clean and simple.

There’s only one method of note in this application: RefreshData()

   1: private void RefreshData()

   2: {

   3:     string deviceName = System.Net.Dns.GetHostName();

   4:  

   5:     textBoxDeviceName.Text = deviceName;

   6:  

   7:     IPAddress[] addresses = Dns.GetHostEntry(deviceName).AddressList;

   8:  

   9:     comboBoxDeviceIP.Items.Clear();

  10:     for (int i = 0; i < addresses.Length; i++)

  11:         comboBoxDeviceIP.Items.Add(addresses[i].ToString());

  12:  

  13:     if (comboBoxDeviceIP.Items.Count > 0)

  14:         comboBoxDeviceIP.SelectedIndex = 0;

  15: }

Download executable: whatIsMyIP.cab

Download Source Code: whatIsMyIP.zip

Feedback

Not bad 10 applications in 10 days. Won’t be long before we’re at 20 applications in 20 days, and then 30 applications in 30 days. Keep the feedback coming.

Tuesday, June 10th, 2008
Chris Craft

Topic: Windows Mobile Programming

Tuesday, June 10th, 2008, is the next meeting of the Pee Dee Area .NET User Group.

Chris Craft will be presenting at Microsoft Mobility Roadshow alongside Brian Hitney, Glen Gordon, and Lou Vega in Charlotte - June 18, 2008 and Atlanta (Alpharetta) - June 24, 2008. These are full day Windows Mobile device application development events.  PDANUG will be hosting our own special "Welcome to the World of Windows Mobile" event to keep in theme these two MSDN events.
Focus will be Windows Mobile 6.x and using Visual Studio 2008 to developer mobile applications.
Topics to be covered:

•       Intro to Windows Mobile
•       Data Guidance (some discussion of line of business applications)
•       Whole New Level

Here is the tentative schedule:
6:00 PM - 6:20 PM Socializing / Free Dinner
6:20 PM - 6:30 PM Introduction, Sponsor Time, and News.
6:30 PM - 8:00 PM Presentations

Microsoft has published a SKU Matrix for Windows Mobile 6.1, and there is also an older one for Windows Mobile 5.0.

Windows Mobile 6.1 makes it easier to stay connected and manage your busy life—from just about anywhere. Windows Mobile 6.1 is full of enhancements, made with your needs in mind. Think about this: When you text with a friend, the messages thread together, just like instant messaging—no more confusion about what you’re talking about. Connecting to a Wi-Fi network is now simpler—no more scrolling through multiple pages; a single click and you’re connected. And Windows Mobile 6.1 runs on a growing variety of phones, including touch screen devices with slide-out keyboards, sleek full-keyboard smartphones, and compact flip phones.

Today's application is meant to be a simple, yet useful, application for people to use out on the town. This is an application that a couple of my friends recommended as a good beginner's introduction application to programming for the .NET Compact Framework. One thing I really like about it is that there is nothing to get in the way of a new developer's understanding of what is going on in this application. Everything is direct and straight-forward.

If you have ever eaten out with a large group of friends and wanted to split the tip, then you probably know how much of a challenge this can be. It seems trivial at first glance, but there is a decent set of variable inputs, and another good size set of outputs. All of which are interrelated. But that is the past, now you have Mobile Tipper to take care of the hard work for you.

Mobile Tipper

There's not a whole lot going on with the UI. It is still clean and simple. I have colored the output fields in a light yellow color, and I have added an icon to the top right of the screen for decoration. Also, notice we are formatting our outputs, and allowing users to enter '%' and '$' characters in the inputs. This is a nice touch of polish that users appreciate. The icon in the top right is also the icon for the applications and the forms themselves. (I couldn't take it; I decided to give the application, a famous light blue color to give it a little life.)

There's a lot of fields, and this is technically a mobile data entry application. So we want to enable our users to enter data as easily as possible. That's why we are using editable comboboxes, and allowing users to enter '%' and '&' characters. The comboboxes are pre-populated with a likely set of inputs users will want to use.

One thing I did also to help with data entry is I assign tab orders to all my input controls, and marked all my output controls TabStop properties as false so they would be skipped over.

I implemented a Tip class that handles all the math calculations, and so on. And I created NumericTextBoxes and NumericComboBoxes that only allow numeric data to be entered. Again try to make end users lives easier.

You might be wondering what my secret is to handling the character's '%' and '$', it is the trusty String.Replace() method. I replace both of those characters with String.Empty's. :D

     return Decimal.Parse(this.Text.Replace("$", string.Empty).Replace("%", string.Empty));

I came close to skinning this application with some kind of butler them skin. Basically a white and black theme with a little bowtie band somewhere across the top, or middle with a watermarked jacket front in the application form's background. But decided it probably wouldn't end up looking like it does in my head.

Download executable: mobileTipper.cab

Download Source Code: mobileTipper.zip

Feedback

Tomorrow will be our tenth application, and mark us at 1/3 complete. So far I have managed to design, create, publish, and explain a new and different .NET Compact Framework application everyday. My goal is to do it everyday this month. Your support really makes a difference so keep it coming!

Wow, time sure does fly when you're having fun. Since the beginning of the June, we have already knocked out over a half-a-dozen applications. It's hard for me to choose a favorite, as there is such variety, and many of you submitted great application ideas. If I had to pick a favorite, I think I would pick Mobile FX, since it is just fun.

What's your favorite?

Minutes to Midnight Countdown	Bluetooth Manager	GPS Compass	Mileage Tracker

Look at the variety: a countdown time, a Bluetooth control panel type application, a GPS application, and a work utility.

Mobile Capture	Pocket PasswordGen	Mobile FX	What will be next?

Again, we get around as far as application topics: screen shot utility, password generator, a sound FX app, and who know's what we'll do next...

Looking forward to this week's applications? Let's see where we'll go next.

Wow, things are really moving around here. First Lou Vega offers to help with 30 Days of .NET as the VB .NET Editor. And now Christopher Fairbairn has offered to help as the C++ Editor.

A little about Christopher:

Christopher is the leader of the Christchurch .NET User Group. In case you didn't already know, Christchurch is in New Zealand. (Pretty cool reading about their climate, and I didn't realize they are know as the "Gateway to the Antarctic"). Christopher has a great blog mostly focused on Windows Mobile C++ development, which can be hard to find good information on when you are first starting out. Be sure to take a moment and read Christopher's "About Me" page. I think you'll agree that we are lucky to have him on the team, and that we are looking forward to seeing take on device application development for Windows Mobile.

So far, Christopher is off to a great start having already reproduced two of the applications I have written. One of the thing I really enjoy is reading the blog post Christopher does for application he translates. He a great job of explaining the nuts and bolts of everything that he is doing. He is very detailed and very thorough, you can learn a lot simply following along with him

Day 01 - 30 Days of .NET [Windows Mobile Applications]: Minutes to Midnight Countdown: C# Edition / C++ Edition

Day 02 - 30 Days of .NET [Windows Mobile Applications]: Bluetooth Manager: C# Edition / C++ Edition

We have discussed the ability to assign an Windows Mobile application we have created to a device's hardware button. Once with our day two application, Bluetooth Manager, and once again with our day eight application, Rotate Me.

By default my device's buttons are configured as follows: "Button 1" starts "Internet Explorer", "Button 2" starts "Messaging", "Button 3" starts the "<Start Menu>", "Button 4" starts "<OK/Close>", and finally "Button 5" starts the "<Camera>". If you look at the screenshots below, you'll noticed I changed "Button 2" to start the "Rotate Me" application instead. This is the "as good as it gets" way to start an application; doesn't get better than one button press access.

Just in case everyone isn't aware of the feature in Windows Mobile, I've posted the steps here:

First click the "<Start Menu>", now click on "Settings" menu item, next click on the "Buttons" icon under the "Personal" tab, finally select a button and assign it a program. It's that easy.

Yesterday, I read the following suggestion for the 30 Days of .NET series.

"How about a program to manually rotate from portrait to landscape, the millions of new HTC Diamond owners would love that " - Alex

Lucky guy, the HTC Diamond is a gorgeous device. I mean really, really good looking device - if Scarlett Johansson were a phone good looking here.

Don't take my word for it. See for yourself:

On my HTC device there is an today plug-in named "HTC Home", that gives me an icon I can click on my today screen which will rotate my device's screen. See screen capture, I've converted everything else to grayscale.

This is a great little app, that does everything it claims it will do. Only thing is I hate it. I hate it because it doesn't do what I want it to do. It rotates through all four combinations of screen directions: top (0 degrees), left (90 degrees), bottom (180 degrees), and right (270 degrees). See that's the rub, never want to see my device upside down.

So basically, every time you click this icon the screen rotates 90 degrees, which means I have to go through what I consider two junk orientations, bleh.

I think we can do better.

This is probably going to be the easiest application we write. Thanks, Alex! ;D

I considered a few approaches to this application. I thought about following the same model as HTC and placing the application somewhere on the Today screen. Basically there are three ways to accomplish this. One we could write a today screen plug-in, but this isn't straight-forward in an managed application. There is a way to do it however: Creating a Pocket PC Today Screen Plug-in with the .NET Compact Framework.

Or we could create a task tray icon for our application. If you look right about the Contacts menu item in the bottom right of my screen, you can see three application task tray icons. Again, I felt this was more work than worth. But here how you could do it: Using the Microsoft .NET Compact Framework MessageWindow Class.

Finally, I though we could add an icon to the notification area at the top-right of the screen. If you'll look at my screenshot again you'll see where I have 6, count them 6, notification icons on my device. Everyone is doing this lately, and it starting to get out of hand lately. But if you like here's the information you'll need to accomplish this: Programmatically create and display Notifications.

So what was my solution? Well, I decided to leave well enough alone. This leaves the end user three choices, one assign the application to hardware button, to assign the application to a today screen plug-in that can launch other applications, and three to simply run the application manually. A lot of today screen plugs-ins have application launchers capabilities. Back to my screenshots, the today screen plug-in at the top of the screen allows for nine applications to be started from it. I've highlight the icon for Rotate Me, and made the rest the screen grayscale.

So how hard is it to check the screen orientation and change it? You tell me.

using Microsoft.WindowsCE.Forms;

if (SystemSettings.ScreenOrientation == ScreenOrientation.Angle0)
    SystemSettings.ScreenOrientation = ScreenOrientation.Angle90;
else
    SystemSettings.ScreenOrientation = ScreenOrientation.Angle0;

Here's a link to a blog post I did on How To: Assign an Application to a Windows Mobile Device's Hardware Button in case you need it.

Sometimes it is surprising just how much you can get for such little time and effort. That's the power of the .NET Compact Framework.

Well, that does it for today. Here are the binaries. Hope you enjoy them.

Download executable: rotateMe.cab

Download Source Code: rotateMe.zip

Feedback:

Thanks guys, it's been fun. Keep the ideas coming. Don't wait until the last minute. I hope these applications are helping you realize the raw rapid application development power of the .NET Compact Framework.

This is my favorite application so far. The concept is awesome. It takes the idea of a "sound effect keychain", and make it into a fully open and extensible mobile application.

Mobile FX

So if you are following me, then you know that if you press the birds button you'll hear a birds sound effect, and if you press the bomb button your hear a bomb sound effect, and son on down the list.

This application tries to be as much about form as it is function. All of the icon graphics are created with Axialis IconWorkshop. (Thanks for the heads up, Jamey!) It makes making really great icons a snap using its Image Object Packs. (See the image to the right for a small sample.)

What I really like about this application is there is the possibility of creating add-in sound packages. I'll discuss this more in a follow up blog posting to come soon. [If there is interest? Let me know.]

The way the application works is it looks for an XML file that tells it where each of its possible icons are and where the sound files for each icon are located as well. If you want to change the order of the icons on the screen just change the order of the "buttons" in the XML configuration file.

I haven't completed the extensibility point for others to add there own icons and sounds but that is a small enhancement which I'll do shortly.

Download executable: mobileFX.cab

Download Source Code: passwordGen.zip

Feedback:

How interested are you guys in the follow up article? Is this something you would enjoy? Would you like a second pack of sounds? Is this application something you would use? Would you create a sound pack of your own?