Friday, July 21, 2006

Custom Components for the CF

After following all my own guidelines and creating a functional CF program for .NET2.0 ( the 'CFSimpleTerm' program, a serial communication terminal which you can find in the 'Downloads' section of C-Scope) I decided to start working on my first custom component. I found notes on the web everywhere that his was so simple in C#...
But ofcourse I wanted to create a custom component for the CF. Because one of the first things that strike you when developing CF applications (after finding out how 'simple' it is) is that the final application looks real 'basic', or even 'dull' I'd say. You cannot change fonts or colors of standard controls, and everything is flat (which is the standard for PocketPC's, I know, but I like it a little more fancy than that..). So I started out creating an enhanced button, with 3-D look, user definable color, and selectable font. Something like this:
So I used the 'Custom Component' wizard to create a 'xButton' class, derived from the standard Button. Something like this:

using System;
using System.Drawing;
using System.Windows.Forms;

namespace xControls
/// <summary>
/// Description of UserControl1.
/// </summary>
public partial class xButton : Button
private Color m_color1 = Color.LightGreen; //first color
private Color m_color2 = Color.DarkBlue; // second color
.... more code....

And this is what it looked like after two struggling two evenings with the .NET Drawing and Event override functions. Color, font and text alignment can be selected, and there is a basic 3D look.
Finally I copied a sample program using this xButton control to my PocketPC, only to find out that the button is still the same flat, grey one as in my previous applications :-(
So what went wrong ? Microsoft has the answer on this page. The following line explains it all:
"...most of the standard controls, such as Button, ListBox or Label, don't allow you to override the OnPaint event and add custom drawing to them..." So much for my custom button that overrides the OnPaint event. Fortunately the solution is also given here. Custom controls for the CF should always start from the toplevel 'Control' class, which does allow the overriding of the OnPaint. And, how convenient, the forementioned article contains a lot more hints and tips on creating a custom image button, so I suppose I had to start all over. I don't think just changing 'Button' to 'Control' in the class declaration will be sufficient. But ofcourse I did try it, just to see what happens. And to my (big) surprise, the program compiled without any warning, the button looked exactly the same when running the program on my PC, and... it also worked on the PDA ! So much for my first step towards what I hope will be a series of 'fancy' controls for the CF.
(Hey hey, but how did you actually do it ? Just look at the source here to find out...)

No comments: