WPWidgetLibrary Wiki Rss Feed

Updated Wiki: Documentation

ddobric — Mon, 24 Oct 2011 16:28:22 GMT

Please be aware of following. When WpWidgetLibrary framework is initialized, we start the copy process of all Web-content located in specified folder. This folder is defined by following call:

InstalHTMLContent(string htmlFolder, string[] htmlDirs)

where htmlFolder is the folder in solution which contains all required web files. In other words this is the root of web-application which will be executed from isolated storage. Because you are free to use any kind of extension like “myfile.tiff” the framework can either copy any file in your project or specific files. We decided to copy specific files only.

Here is how we do it:
protected virtual bool IsWebExtension(string ext)
{
bool res = false;

switch (ext.ToLower())
{
case "htm":
case "html":
case "js":
case "jpg":
case "jpeg":
case "png":
case "css":

res = true;
break;
}

return res;
}

If your application contains some media file like “abc.avi” you will have derive from WPWidgetLibrary
and override this method.
public class MyWPWidgetLibrary: WPWidgetLibrary
{
protected override bool IsWebExtension(string ext)
{
bool res = false;

switch (ext.ToLower())
{
case "avi":
return true;
break;
}

return base.IsWebExtension(ext);
}

}

Updated Wiki: Home

bhrnjica — Tue, 18 Oct 2011 10:53:14 GMT

Why do you need WpWidgetLibrary?

Do you want to implement apps for cross-browser support? Is so and if you are Windows Phone developer this is the right project for you.
This project gives you ability to startup with HTML5 at Windows Phone right now.

Windows Phone 7.1 has internet browser based on the Internet Explorer 9, and the version in WP7.1 is the almost the same build used for IE9 desktop edition.
This means the WP7+ is able to render HTML5 content. In comparison to Chrome it is supported less HTML5 elements, but some of important features like geo-location,
canvas etc. works well. Usually Widows Phone is executing the HTML5 application which is hosted on some web server, and it is not a big deal to open IE on phone
and to navigate to the URL of the HTML5 web application. For more information about HTML5 support at Windows Phone and other devices please take a look on
Damir's post "HTML5 for Windows Phone 7.1+ - Episode I"

As long you are browsing your HTML5 application in WebBrowserControl there is no need for you to use this library. However, one app should be in general installed on device.
Currently there is no way for WebBrowserControl to navigate to HTML file which is located somewhere in file system at the phone as this is supported by Android and iOS.
If you want to install your HTML5 application on device like Windows Mobile 6.5 did it with widgets this is the library which will help you to do this by calling of a single line of code.

This library helps you to deploy a HTML app to Windows Phone 7. The library contains set of helper methods which extract web content from application resource to isolated storage.
On that way it is possible to develop WP7 HTML5 app which can pass marketplace requirements as purchasing, updating, installing, works offline etc.

Widget class library solves this problem by deploying cross platform HTML5 Widget application on Windows Phone 7 so that web content can be installed on disk.
With WPWidget you can easily make Windows Phone 7 hybrid application containing of the native part written in Silverlight and web part written in HTML, JavaScript and CSS.

If you want to know how we have been inspired to setup this project please take a look on Damir's Episode II "Browsing HTML content".

How to use the WPWidgetLibrary?

In only few steps you can make fully functional hybrid Windows Phone 7 application. On the picture below it is shown how to use the library.

1. Reference Daenet.WidgetLibrary.dll in to you WP7 project.

2. Copy your HTML (App) to some project folder and mark all files in build action as EmbededResource.

3. From the Toolbox drag the WebBrowser Control and in PageLoaded event navigate to desired webpage. (See red rectangle in xaml file.)

4. In the MainPage constructor append following code. This code will on start of application copy all HTML related content to isolated storage.
The string array (second argument of InstallHTMLContent) should contain all subfolders of your project which have to be copied to Isolated Storage
too. If you have very simple App with all files in one folder, then this argument is not required.

5. Set initial page to webBrowser control from the MainPage Loaded event in code-behind.
   Following code is a common WebBrowserControl code, which starts browsing of the page.
   Please note that navigating page (StartPage.htm) is not the page hosted online. It is the page
   in Isolated Storage.

Compile and run the application, and you are looking the full featured HTML Widget application.

More information will be published on demand in our blogs:

1. Damir Dobric Blog

2. Bahrudin Hrnjica Blog