No, this is not what you think this is. This is a proof of a concept .Net CF v2 program that I've put together during my 2 train rides home and to work. And yes, the button does slide. The code is pretty simple. It just draws the images in the right places with transparency. The transparency is achieved by using AlphaBlend API function that's become available in Windows CE 5.0. I think this proves that the UI's that we can create in CF are not limited to the usage of a standard controls. With enough creativity we can spice up our applications with this kind of eye candy.

You can download the project from here:

The ‘Gestures’ paradigm was introduced a few years ago for internet browsers and became quite popular. Tablet PC platform also recently added ‘gestures’ recognition to its arsenal. But I always thought that this functionality could be really valuable for the Pocket PC platform as well: it has a touch screen, limited screen space and is a perfect candidate for improving user interoperability of our applications. So, how can we implement the ‘gestures’ in NET CF? vbAccellerator has had this whitepaper explaining how it could be done for .NET.  He implements the IMessageFilter to hook up into application’s message loop and catch all mouse messages. When the ‘MouseDown’ message is received he starts collecting the mouse coordinates and on ‘MouseUp’ would stop collecting and interpret the collected data. I’ve ported this code to NET CF utilizing the Application2 functionality from the SDF v2. Here is the screen shot of the sample application:

This code implements recognition of a very simple gestures like moving up or down, left or right, left and then up etc… If you want to implement recognition of more complex gestures, you would need to resort to more sophisticated methods like neural networks. Codeproject.com has a few interesting articles on this subject. Many of these could be easily ported to CF.

But even having been able to recognize the gestures provided by this implementation can add a lot more usability to your Pocket PC applications. Move your stylus to the right and you can switch to the next screen. ‘Down’ – and you can scroll the form or the ListBox or Grid etc…

One of the recent question that came up on the forums on how to extract icon from an exe file in CF. The ExtractIconEx is available on Windows CE platform as well as desktop, so I went to http://www.pinvoke.net/, copied the code from here, removed unneeded 'unsafe' statements and modified the PInvoke declarations to use coredll.dll:

public static Icon ExtractIconFromExe(string file, bool large)

{           

       int readIconCount = 0;

       IntPtr[] hDummy = new IntPtr[1] { IntPtr.Zero };

       IntPtr[] hIconEx = new IntPtr[1] { IntPtr.Zero };

       try

       {

          if (large)

               readIconCount = ExtractIconEx(file, 0, hIconEx, hDummy, 1);

          else

               readIconCount = ExtractIconEx(file, 0, hDummy, hIconEx, 1);

          if (readIconCount > 0 && hIconEx[0] != IntPtr.Zero)

          {

             // GET FIRST EXTRACTED ICON

             Icon extractedIcon = (Icon)Icon.FromHandle(hIconEx[0]).Clone();

             return extractedIcon;

          }

          else // NO ICONS READ

             return null;

       }

       catch (Exception ex)

       {

           /* EXTRACT ICON ERROR */

           // BUBBLE UP

           throw new ApplicationException("Could not extract icon", ex);

       }

       finally

       {

           // RELEASE RESOURCES

           foreach (IntPtr ptr in hIconEx)

              if (ptr != IntPtr.Zero)

                   DestroyIcon(ptr);

                   foreach (IntPtr ptr in hDummy)

                        if (ptr != IntPtr.Zero)

                            DestroyIcon(ptr);

       }

}

[DllImport("coredll.dll")]

static extern int ExtractIconEx(string szFileName, int nIconIndex,

  IntPtr[] phiconLarge, IntPtr[] phiconSmall, uint nIcons);

[DllImport("coredll.dll", EntryPoint = "DestroyIcon", SetLastError = true)]

private static  extern int DestroyIcon(IntPtr hIcon);

 The followup question was how to display the Icon in the PictureBox, so here it the quick solution for it too:

public Bitmap GetBitmap(Icon icon)

{

     Bitmap bmp = new Bitmap(icon.Width, icon.Height);

     //Create temporary graphics

     Graphics gxMem = Graphics.FromImage(bmp);

     //Draw the icon

     gxMem.DrawIcon(icon, 0, 0);

     //Clean up

     gxMem.Dispose();

     return bmp;

 }

Yeah.... it's been a while I posted on this blog. I've been submerged into a very time demanding, but incredibly interesting project which involved quite a wide range of technologies, like Outlook 2007, Exchange 2007, Sharepoint 2007 and of course a Windows Mobile piece. You can see a glimpse of the project in the video that was created for Microsoft Launch events in January:

http://www.infusiondev.com/news/CaseStudies.htm

It's the first case study on the page.

Microsoft recently have made the Windows Mobile Network Analyzer available for download. It's a Power Toy that runs on a device and can be used for troubleshooting network connectivity issues. It includes utilities such as ping and ipconfig as well as captures network traffic to a .cap file which you can later view with Network Monitor tool or the Ethereal tool.

Ah.. yes, the WCF (Indigo) will be available in the new version of the .NET Compact Framework! Read this blog by Roman to get the latest scoop. And yes, they do listen ;)

We have released the PopupMenu Component that I'd described before. See this page on where and how you can get it.

The next challenge that I am going to share my solution with you is the Office 2007 like window style. As you know, the Office 2007 applications are using the layered windows functionality to display rounded corners and a custom title bar. This is how the typical  window in the new Office looks like:

Since the June CTP, WPF allows you to create layered windows by setting the AllowsTransparency to true, Background to Transparent and WindowsStyle to none. Result of that will be a transparent window with no titlebar or borders, so it is our task to draw a non-client area. It didn’t take long time for me to create XAML to display a titlebar with images on a particular window, but what do I do in order to re-use this style on any window in my app? It took me a while to figure out (trial and error again and again…) that the only way right now to declare a style/template for a Window is to do it in the App.xaml, so my first version contained all the xaml and a code in the App.xaml and App.xaml.cs which I didn’t feel was a good way to encapsulate your logic in a re-usable component. Luckily for me, I got to work with Josh Smith who knows quite a few things about WPF, showed me a way how to move my logic into a separate re-usable files. Which is to create XAML file as a ResourceDictionary and a corresponding code file. Don’t forget to declare x:Class attribute in order to associate the code file with this XAML:

  x:Class="OfficeStyleWindowProject.OfficeStyleWindow"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
   xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
   xmlns:ctl="clr-namespace:Controls.Local"
    >

…

The App.xaml will have to be changed as well:

<Application.Resources>
   <ResourceDictionary>
      <ResourceDictionary.MergedDictionaries>
         <ResourceDictionary Source="OfficeStyleWindow.xaml" />
       <ResourceDictionary.MergedDictionaries>
   <ResourceDictionary>
                     
Of course as soon as I moved to the “templated” world, the event handlers stopped working and I had to do the following: First of all, I created a few custom controls: ImageButton and TitleBar. I would imagine the ImageButton should be a pretty useful control on its own. It implements a few dependency properties ImageNormal, ImageOver and ImageDown which you would use to assign an appropriate images to a button. This control provides similar functionality to what Josh had described in his blog.
There is nothing too fancy in the TitleBar except for a way to hook up into the CloseButton, MinButton and MaxButton Click events. Here’s a snippet that shows how I did it:

First we need to hook up into the control’s Loaded event:

public TitleBar()
{

   this.MouseLeftButtonDown += new MouseButtonEventHandler(OnTitleBarLeftButtonDown);                   

this.MouseDoubleClick += new MouseButtonEventHandler(TitleBar_MouseDoubleClick);
   this.Loaded += new RoutedEventHandler(TitleBar_Loaded);

}

Second, in the loaded event we need to use the FindName method to get to the instances of the buttons:

void TitleBar_Loaded(object sender, RoutedEventArgs e)
{
      closeButton = (ImageButton)this.Template.FindName("CloseButton", this);
      minButton = (ImageButton)this.Template.FindName("MinButton", this);
      maxButton = (ImageButton)this.Template.FindName("MaxButton", this);
 
      closeButton.Click += new RoutedEventHandler(CloseButton_Click);
      minButton.Click += new RoutedEventHandler(MinButton_Click)
      maxButton.Click += new RoutedEventHandler(MaxButton_Click);
}

Overall I am pretty happy with the result. The code has become completely encapsulated in a separate and re-usable files and can be easily added to any project. Here's how the window looks in the test project:

You can download the project with the complete source code from here: