How To : Host Silverlight Xap in Blogger

Hositing Silverlight XAP in Blogger... Aah At last succeded.. Yipeee

I was trying to host silverlight application in blogger from the past two weeks and at last succeded today :) as you can see below.

When i first googled, i found this wonderful post of timheuer which explains about cross-domain hositing of silverlight application in detail.

The big question which i had after reading tim's blog post is, where do i host my xap file as i need to set the XAP mime type on the hosting server, I personally do not own any hosting space nor any domain.
In the next moment i started searching for free file hosting providers, which can provide me a direct link for hosted file with file extension so that i can refer to the xap file directly. I tried around 5 different file hosting servers but i couldn't figure out how to set the mime extension type on that perticular server to render my silverlight xap on my blogger blog.

In my 6th attempt to host xap, i have tried with xtreemhost file hosting which has not only provided me with a direct link to the hosted file but also provided access to the .htaccess file where i could add my MIME types.

So here are few things which we need to take care before hosting a silverlight application on to blog:

• Make sure you have added the EnableHtmlAccess parameter to the object tag in html
  

  <param name="enableHtmlAccess" value="true" />

• Make sure you have set ExternalCallersFromCrossDomain to ScriptableOnly in the AppManifest.xml file in silverlight project
  

  <Deployment xmlns="http://schemas.microsoft.com/client/2007/deployment"
          xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      ExternalCallersFromCrossDomain="ScriptableOnly">
      <Deployment.Parts>
      </Deployment.Parts>
  </Deployment>
  

• Add the MIME types on the hosting server(if not added already :)).
  On XtreemHost this is how i added the MIME types, In the /htdocs directory i have created a new file with name .htaccess and added the below mentioned two lines in the .htaccess file
  

  AddType application/x-silverlight-app .xap
  AddType application/xaml+xml .xaml

Here onwards everything should be straight-forward and simple, upload your xap file on to the file hosting server and set the source value in the object tag to the hosted xap file, below is the object tag for the above rendered silverlight application

<script type="text/javascript" src="http://xthkranthi.xtreemhost.com/Silverlight.js"></script>
<div id="silverlightControlHost" Style="height:100px;width:100px;">
<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">     
<param name="source" value="http://xthkranthi.xtreemhost.com/Test.xap"/>
<param name="onError" value="onSilverlightError" />
<param name="background" value="white" />
<param name="minRuntimeVersion" value="4.0.50401.0" />
<param name="autoUpgrade" value="true" />
<param name="enableHtmlAccess" value="true" />
<a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=4.0.50401.0" style="text-decoration:none">       <img src="http://go.microsoft.com/fwlink/?LinkId=161376" alt="Get Microsoft Silverlight" style="border-style:none"/>     </a>      </object><iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe>
</div>

Done.. That should do it!!!! If nothing went wrong then your silverlight application should be on you blog as mine :).

Hope this helps someone.. comments are always welcome and please let me know if you have any issues in loading silverlight applicaiton on your blog.

Workaround for showing a tooltip for disabled control in silverlight

In WPF we have ShowOnDisabled property for ToolTipService, which displays the tooltip even the control is in the disabled state. Intrestingly, i have'nt found this property in silverlight and need to implement this in silvelright.

On googling a bit i found this post in silverlight fourms which says
"Having the ToolTip not show on a disabled element is by design, and compatible with WPF. We realize that Silverlight lacks other means to provide ToolTips on disabled items (such as ToolTipService.ShowOnDisabled), and will be looking into it." as is.

Here is the workaround which i found while implementing this functionalty.

<Border HorizontalAlignment="Center" VerticalAlignment="Center" Background="Transparent" >
     <ToolTipService.ToolTip>
          <ToolTip Content="Tool Tip"/>
     </ToolTipService.ToolTip>                        
          <Button x:Name="button" Width="75" Content="Button" IsEnabled="False" />
</Border>

My first thought to show the tooltip, was to wrap the control (Button) inside another control (Border) and add the tooltip to the parent (Border) control. As we will enable and disable the child control, parent control displays the tooltip.

Unfortunately this did not work. When Button is disabled, Border control is not showing up the tooltip. My guess was Border control is not able to find its child controls when they are disabled, then i tried placing a rectangle with 0.1 opacity beneath the button, which makes sure that border has content irrespective of the enabled state of the button.

[Updating post as some of my friends suggested a better solution, and the good thing was my first thought was not wrong, just making wrapper control (Border) background to transparent is enough.. which works like a charm.. i've updated the code snippet accordingly..]

This was my workaround, If anyone finds a better way please post a comment with that solution. As that may help somebody like me :).

Hope this post helps some one.

How To : Load Multiple XAP files in Silverlight Application

Currently i am working on a project where i had a requirement to load multiple xap files in a silverlight application, or let me keep this way i need to load xap files OnDemand.
I was going through this article on msdn where it explains about "how to load assemblies on demand", before reading this article i really had no idea of how to load multiple xap files, but now i have done that yipee... :)
I just want to blog a bit about how to load multiple xap files in silvelright application, and also share some sample application which demonstrates this. As usual you can find the source code the end of this blog post.

To get started with this sample i've created a silverlight project and added two silverlight class libraries, now my solution looks as shown below

First let us check out how to load a single xap file, the below code shows how to read a xap file and read the dll file for the perticular class for which we want to create the instance and returns that perticular instance.
The Things to check out in the below code snippet are the two private variables:

• applicationName - The name of the xap file with out extension.
• control - The class in the above mentioned application for which you want to create instance.

public partial class MainPage : UserControl
    {
        string applicationName = "SilverlightApplication1";
        string control = "Control";

        public MainPage()
        {
            InitializeComponent();
            WebClient wc = new WebClient();
            wc.OpenReadCompleted += new OpenReadCompletedEventHandler(wc_OpenReadCompleted);
            wc.OpenReadAsync(new Uri("SilverlightApplication1.xap", UriKind.Relative));
        }

        void wc_OpenReadCompleted(object sender, OpenReadCompletedEventArgs e)
        {
            StreamResourceInfo resourceInfoDLL = Application.GetResourceStream(new StreamResourceInfo(e.Result, null),
                                                 new Uri(string.Format("{0}.dll", applicationName), UriKind.Relative));
            AssemblyPart assemblyPart = new AssemblyPart();
            Assembly assembly = assemblyPart.Load(resourceInfoDLL.Stream);
            UIElement element = assembly.CreateInstance(string.Format("{0}.{1}", applicationName, control)) as UIElement;
            LayoutRoot.Children.Add(element);
        }
    }

Using the webclient we can read the xap file and load its content in the silverlight applicaiton as shown above, I have added the "Control" instance, which is a user control in SilverlightApplication1 project to the LayoutRoot, which is a grid in our Main Silverlight application.
If we want to load multiple xaps then we need to create multiple instances of webclient and load xap files, The final output of the shared source code would look like the below image.

At last here is the Source Code for this particular blog post, to load xap files ondemand.
Hope this post helps some one in need... :)