Setting up a Windows Mobile Development environment for HTC Touch Diamond development

Just this week I bought a new mobile phone. Of course it's a Windows Mobile powered mobile phone, a HTC Touch Diamond. I thought: "What about some .NET Compact Framework 3.5 development". So I started setting up a Windows Mobile Development VPC.

I started with the following:

  • Windows Server 2008
  • Visual Studio 2008 (with Smart Device extensions installed)

After this I wanted to be able to develop for Windows Mobile 6.x so I needed more, much more.

Installing Windows Mobile 6 wasn't really easy. I needed a pre-requisite, Windows Mobile Device Center. But sadly trying to install this I got a very informative message: "The update could not be installed because at least one Windows component required by Windows Mobile Device Center is missing". So which component? After some Googling I found out it was the "Desktop Experience" feature that needed to be installed on Windows Server 2008. So it took me some time, but in the end I got the SDK running.

Next step would be getting the networking available from the emulator. This looked easy, but I got a strange message: "Failed to open the VPC Network Driver. Verify that the driver is installed...". So some more Googling. The solution lies in using the Windows Mobile Device Center for sharing the connection. This article explains everything (in the old days we would have used ActiveSync as mentioned in the article).

In the end I got my blog loaded in Internet Explorer on the Emulator.

image

Restarting the Silverlight Object with different initParams from within Silverlight

On the Silverlight forums I found out someone wants to refresh the Silverlight Object from Javascript. Basically this solution calls a Javascript function from the Silverlight environment. I though it would be a good way to make use of features available in Silverlight.js to make it easier to create the Javascript function to refresh the Silverlight Object. The strange thing was it took me a long time to get it to work. Yes this small part Javascript in the example below took me a very long time. This has all to do with using Google Chrome and Mozilla Firefox. In the end I was not able to get this working in Chrome and Firefox, I'm not sure if this is because of failing in Silverlight.js or not, but I was not even able to load an initial Silverlight Control from javascript.

The solution: One Javascript function, and a call from Silverlight to the Javascript function. (Only working from within Internet Explorer)

The Javascript function.

The function is very straight forward. I make use of the Silverlight.js function Silverlight.CreateObject. The function I created asks for three parameters, the hosting element (will contain the Silverlight control), the source (location of the xap file), and the initParams.

function CreateSilverlight(hostElement, source, initParams) { var pluginId = hostElement.id + "PluginId"; hostElement.innerHTML = Silverlight.createObject(source, null, pluginId, { width: "200", height: "50", background: "white", alt: "<!--Silverlight 2.not installed-->", version: "2.0.31005.0", autoUpgrade: true }, { onError: onSLError, onLoad: onSLLoad }, initParams, hostElement.id); }

Make it load from the window.load.

window.onload = function() { CreateSilverlight(silverlightControlHost, "ClientBin/MM.Silverlight.Experiments2.SUI.xap", "param1=value1,param2=value2"); }

The call from Silverlight.

I wanted to be able to see that the code was actually executed so I put a timestamp in. Calling Javascript from Silverlight is very easy, you can make use of either HtmlPage.Window.Eval or HtmlPage.Window.CreateInstance, I used HtmlPage.Window.Eval.

HtmlPage.Window.Eval(string.Format( @"CreateSilverlight(silverlightControlHost, 'ClientBin/MM.Silverlight.Experiments2.SUI.xap', 'currenttime={0},otherparam=othervalue');", DateTime.Now));

This is all, nothing more, the sad part I only got it working in Internet Explorer, but that might be because of some bad Javascript. I attached the full solution for download.

Best Christmas Wishes!

A small Christmas greeting from my family.

Kerstfotokaart

Getting Shared Networking (NAT) to work with Windows Server 2008 as a Virtual PC Machine

I've had trouble in the past with sharing my internet connection with Windows Server 2003 but also with Windows Server 2008 in Virtual PC. This is because I have no physical network connection at home, I do everything wireless. And setting the physical network device as network adapter for the virtual machine doesn't work either. So I followed the following steps.

Step 1: Set the virtual machine settings to Shared Networking (NAT).

image

Step 2: Set the network settings inside the Virtual Machine, manual set the Preferred DNS Server to 192.168.131.254.

image

 

This did the trick for me. I hope this will work for more people because it did take me a long time to find this solution.

Combining Silverlight and Google Chart API

It's already almost a year ago when I found out about Google Chart API. I used it for my year ending post of 2007. I haven't done anything useful with Google Chart API after this post. But I'd like to experiment, so I thought what about an integration between Silverlight and the Google Chart API.

Integration

The integration is a very slim line. Just a HTTP Get to an Uri that follows the specs in the Google Chart API. The documentation consists of the following parts:

But all I used was basically the example on the API front page:

http://chart.apis.google.com/chart?cht=p3&chd=t:60,40&chs=250x100&chl=Hello|World

This example contains the following parts: Chart Type, Chart Data, Chart Size and Chart Labels.

How I want it to work?

I want to be able to do a very simple thing in the Silverlight application. No logic about how the integration is done, is a very important idea. I also have the meaning that we should not have to use a special control to view a chart, just because we already have an Image control for viewing an image. A chart is not that much more than an image, isn't it?

1 var chartData = new GoogleChartData 2 { 3 Size = new Size(400, 200), 4 Type = ChartType.Pie3d, 5 Labels = {"Silverlight", "Flex"}, 6 Data = {"20", "80"}, 7 Title = string.Format("RIA's{0}Compared", Environment.NewLine) 8 }; 9 10 chartImage.SetValue(HeightProperty, chartData.Size.Height); 11 chartImage.SetValue(WidthProperty, chartData.Size.Width); 12 13 chartImage.Source = googleChartBuilder.ConvertFrom(chartData);

Set up the chart data in lines 1 to 8. After this I want to make sure the target image control has the same dimensions as set in the chart data. Then run the GoogleChartBuilder to convert the data to an image.

The inner workings

The GoogleChartData class is just a data structure class.

1 public class GoogleChartData 2 { 3 public GoogleChartData() 4 { 5 Data = new List<string>(); 6 Labels = new List<string>(); 7 } 8 9 public IList<string> Data { get; set; } 10 public IList<string> Labels { get; set; } 11 public Size Size { get; set; } 12 public ChartType Type { get; set; } 13 14 public string Title { get; set; } 15 }

The logic is divided in two classes, one for constructing any uri you can think of, the other one for transforming the GoogleChartData into a querystring dictionary. The UriBuilder is very simple just ensures that the first part is preceded by a ?-character and the next parts are preceded by the &-character.

1 public class UriBuilder : IUriBuilder 2 { 3 public Uri Build(string baseUri, string page, IDictionary<string, string> queryString) 4 { 5 if(string.IsNullOrEmpty(baseUri) && string.IsNullOrEmpty(page)) 6 throw new Exception("baseUri and/or page should be provided."); 7 8 UriKind kind; 9 if (string.IsNullOrEmpty(baseUri)) 10 kind = UriKind.Relative; 11 kind = UriKind.Absolute; 12 13 var uriBuilder = new StringBuilder(string.Concat(baseUri,page)); 14 if(queryString!=null && queryString.Count >0) 15 { 16 char separatorCharacter = '?'; 17 foreach (var queryPart in queryString) 18 { 19 uriBuilder.Append(separatorCharacter); 20 uriBuilder.Append(queryPart.Key); 21 uriBuilder.Append('='); 22 uriBuilder.Append(HttpUtility.UrlEncode(queryPart.Value)); 23 24 separatorCharacter = '&'; 25 } 26 } 27 return new Uri(uriBuilder.ToString(), kind); 28 } 29 }

Now for the part that's responsible for the translation of the GoogleChartData into an uri.

1 public class GoogleChartBuilder : IGoogleChartBuilder 2 { 3 private readonly IUriBuilder uriBuilder; 4 5 public GoogleChartBuilder(IUriBuilder uriBuilder) 6 { 7 this.uriBuilder = uriBuilder; 8 } 9 10 public BitmapImage ConvertFrom(GoogleChartData googleChartData) 11 { 12 IDictionary<string,string> queryString = new Dictionary<string, string>(); 13 14 //ChartSize 15 queryString.Add("chs",string.Format("{0}x{1}",googleChartData.Size.Width,googleChartData.Size.Height)); 16 17 //ChartType 18 if(googleChartData.Type == ChartType.Pie3d) 19 queryString.Add("cht","p3"); 20 21 //Labels 22 if (googleChartData.Labels != null && googleChartData.Labels.Count > 0) 23 queryString.Add("chl",string.Join("|", googleChartData.Labels.ToArray())); 24 25 //Data 26 if (googleChartData.Data != null && googleChartData.Data.Count > 0) 27 queryString.Add("chd", string.Concat("t:",string.Join(",", googleChartData.Data.ToArray()))); 28 //Title 29 if(!string.IsNullOrEmpty(googleChartData.Title)) 30 queryString.Add("chtt",googleChartData.Title.Replace(" ","+").Replace(Environment.NewLine,"|")); 31 return new BitmapImage(uriBuilder.Build("http://chart.apis.google.com/", "chart", queryString)); 32 } 33 }

This isn't that difficult and translates into something like the following.

Google Chart API and Silverlight combined

This solution is not done at all, it's just a proof-of-concept of the integration of Silverlight and the Google Chart API. You can download the sources here.