How to build a Silverlight control?

Very recent I build a web top in Silverlight. As this is a new technology I have to build lot of control for myself. And I find some difficulty to building control. As I have very short memory I write my findings in my blog so that they will be accessible from anywhere…

I build my project with Orcas so that the entire feature I am writing related to Orcas. Right Button click to your Silverlight project and click add New Item; from Silverlight project choose Silverlight User Control. Give a name to your control, let Button so you will get two file

1. Button.xaml
2. Button.xaml.cs

Button.xaml is used to render your graphics and Button.xaml.cs is used as code behind file. By default it will gives you a canvas and you can draw your necessary items. Add your necessary items to render the button. Let I add two more canvas inside it. And I give them name OuterCanvas and InnerCanvas.

In default page given with Silverlight project you can find any Control by

this.FindControl(“ControlName”);

But in case of control you cannot find any control by

this.FindControl(“ControlName”);

You have to write two lines in your control’s constructor.

Stream ioStream = typeof(Button).Assembly.GetManifestResourceStream("Button.xaml");

FrameworkElement fe= this.InitializeFromXaml(new System.IO.StreamReader(s).ReadToEnd());

And now you have to write

fe.FindControl(“ControlName”);

Now you can subscribe any event, and what ever you want.

Again you can add other rendering item by code. This is very simple and you don’t have to write any xaml for this.

TextBlock block = new TextBlock();

block.SetProperty<double>(Canvas.LeftProperty,5);

block.SetProperty<double>(Canvas.TopProperty,5);

Canvas innerCanvas = fe.FindControl(“innerCanvas”) as Canvas;

innerCanvas.Children.Add(block);

This is as simple as it is…

Cautions:

1. Don't try to subscribe GetFocus() this is restricted only for root element.

2. Don't make canvas full screen in any event it can be done only in MouseUpEvent and MouseDownEvent.

So, lets have fun with Silverlight.

Feel free to contact me for any convenience.

Consume Web service from Silverlight

Calling web service from silverlight is as simple as in C#. In the following article I build a web service and call the web service from Microsoft silverlight. And I will discuss the the problem in the road to these sort of things.

First I build a Web service:

Add a ASP.NET Web Service application in your solution, and you will get an asmx file, write the services you want to expose in the service class. Here I write a simple service which shows child directory and files according to given parent directory.

All exposed service must have an attribute named [WebMethod].

As you want to call the web service from silverlight which is an scripting language you must add System.Web.Extension.dll into references and you must add the following attribute to your service class,

[System.Web.Script.Services.ScriptService]

So that you can call these services from any of the scripting language. These are the things all you have to do in web service project.

Now came to the silverlight application. Let we make a simple silverlight application which print the file and directory list in the canvas.

So you have to add web references to this web service. Mostly all there is an option find web services into this solution. And if your web service is not hosted in IIS then silverlight cannot use this web service. If the web service is hosted by runtime server then the port will be different other than 80, so silverlight handle it as different server and as it cannot handle cross domain call so you get an exception that you are trying to call cross domain services.

So, what you have to do is host your web services into IIS, and when you add web service reference you find web service from local host, and you will get the web service and hopefully you can call it without any exception. Adding web service reference will build a web service proxy in silverlight, you have to build an instance of these proxy and you can call these services in synchronous or asynchronous manner.

I write the following code in my default Page.xaml.cs in Page_load()

TextBlock block = new TextBlock();

block.SetValue<double>(Canvas.LeftProperty,5);

block.SetValue<double>(Canvas.TopProperty,5);

block.FontSize = 10;

block.Foreground = new SolidColorBrush(Colors.White);

localhost.WebServiceProxy proxy = new localhost.WebServiceProxy();

try

{

FileSystemData[] data = proxy.Contents(@"C:\Content");

// FileSystemData is my defined structure

for (int index = 0; index < data.Length; index++)

block.Text += data[index].FileName + "\r\n";

}

catch (Exception ex)

{

block.Text += ex.Message;

block.Text += ex.StackTrace;

}

this.Children.Add(block);

// all the codes are so simple that I don't write description about that.

the following code will print the content of directory C:\Content or it will print the exception. And finally the last trick you have to do is not run this project by F5 or run button, because it runs from file system, so that once again you will get cross domain exception. Just create a virtual directory in IIS for your silverlight project and run from localhost, hopefully all these will work fine.

Nothing is new in calling web service from silverlight just you have careful about cross domain and script permission that's it.