So you want to build an HTML based application for phone 7, but wait there is not a way or at least a 'supported' way of doing that for phone 7. Why would you want to? For for starters wouldn't it be cool to have the same app/code base run on android and iphone. I realize a good portion of the 3 readers on my blog are probably aghast that I use the term 'iphone' (oops there it goes again) but in all honesty as an app developer it would be sooo cool to be able todo that. Let iterate some of the benefits: less time developing for multiple platforms, larger reach to my target demographic, really its not about the technology or the platform but reaching my target demographic.).
Here is how to use it:
Using the HTML App Host Framework
the HTML App Host Framework current consist's of 3 critical parts. 1, the app host shell, 2, the html loader and 3 the task processor. For an HTML application developer you don't really need to worry about most of it but in the following context. To start you need to create an empty Silverlight application in visual studio and then reference the HTML App Host dll. Then you need to create a directory called HTML and add your HTML application to this. The HTML application can include html files, resources, images, css, script files etc and folder structure or whatever you need. On the downside you need to create a 'manifest.xml' file at the root of the html folder that maps all the files. This allows the HTMLAppHostFramework to consume your application and run it on the phone. Here is a typical manifest.xml file:
<?xml version="1.0" encoding="utf-8" ?>
<File Name="index.html" />
<File Name="about.html" />
Basic a simple index of your html application. the trick here is that html assets can't be referenced directly from a xap to say a webbrowser control so the apphost used class called 'IsolatedStorageResourceHelper' to copy everything from the xap based on the manifest.xml file into isolated storage where it can be referenced and executed directly.
The next step is to edit your main page in your app to reference the AppHostShell and your html. The AppHostShell is used much like a webbrowser control but it extends the control to deal with the IsolatedStoargeResourceHelper' class and to expose Phone 7 API's to the script environment so that the script can call out to those API's through 'tasks' using the 'TaskProcessor' class. Also the AppHostShell exposes an event called 'ScriptNotify' so you can extend what is dealt with if there are special cases you want to handle in your own code.
After the HTML app is created, then added to the HTML directory AND you have finished the manifest.xml file, the next step is to add the namespace reference in the XAML of your start XAML page. I like to rename the default 'MainPage' to 'Shell.xaml' but if you do this you have to edit the master app manifest under properties to point at the new name or your app won't work. But you can leave it as 'MainPage'.
In any case, in this page the namespace reference should be in the rootnode and look something like this:
then you can add the control to the xaml surface generally you can just rip out everything in the page and replace even the root grid with this:
<Grid x:Name="LayoutRoot" Background="Transparent">
<HTMLAppHost:AppHostShell Source="/index.html" />
Basically the syntax of the string is "[task name]:[param]*n" currently I've only added a few tasks like email but that I'll be adding much more in the coming weeks. Ping me if you use the framework for your app's, I'll give your app some social media love.
This blog has moved…
4 years ago