Silverlight 4 – Drop target example

One of the feature that stand out most in SL4 is drop target other than Print. I am sure most of all of you run into a user story where the user need to drag and drop a file over some web control. Well I will not blame user, since Win XP, most of the desktop application let user do that, so why not the web application do it.

I got some time yesterday night and gave it a try. It turned out to be so easier than I thought it would be.

The objective of my test was to drop a text file over to a text block and display the content in the text block. Very simple. Here are the things I did. Remember this will work only in Silver light 4.

1. Create a silverlight application in VS2010.

2. Open the designer and drop a text block on to the grid control.

3. In the MainPage.xaml, add ‘AllowDrop’ and ‘Drop’ attributes to TextBlock so the modified one will look like this

1. <Grid x:Name=”LayoutRoot” Background=”White”>
2.        <TextBlock Height=”229” HorizontalAlignment=”Left” Margin=”64,27,0,0” Name=”textBlock1” VerticalAlignment=”Top” Width=”266′” AllowDrop=”True” Drop=”textBlock1_drop” />
3. </Grid>

4. Now in the code behind, we need to add the textBlock1_drop method. (If the method is already there change the body)

1. private void textBlock1_drop(object sender, DragEventArgs e)
2. {
3.      FileInfo[] dropFileInfo = e.Data.GetData(DataFormats.FileDrop) as FileInfo[];
4.      if (dropFileInfo.Count() > 0)
5.      {
6.            StringBuilder fileContent = new StringBuilder();
7.            using (StreamReader dropFileStream = fi[0].OpenText())
8.                   fileContent.Append(dropFileStream.ReadToEnd());
9.            textBlock1.Text = fileContent.toString();
10.      }
11. }

That is it, now compile and run it. You will see a web page with content ‘TextBlock’,. Open Windows explorer and drag a text file and drop it over ‘TextBlock’, it should now show you the content of the text file.

Even though We get the file info in drop event, you can not access the file directly from the physical file location, you should only use the file stream to read the content. It is because of the sandbox restriction.

RAD development in SL4

It is very easy to develop a simple silver light page which does not have any complicated logic without writing a single line code (as my friend put it). Yes it is very easy. But there is another question, if you are simply displaying a data from data source then do you need to follow MVVM model? You could but I do not think it is required since there is no code involved in VM. This is simple forms over data pattern.

In SL4, at your server side, create the Data Model and associate it with a service.  Build the solution. Now go to the client side and under Data there is an option to show the Data Source. From the data source, under domain services, drag the data service you want and drop in the grid control, whola that is it. Now if you run the program it will show you a simple data grid with the data from the domain service.

Couple of things you have remember if you are going in this path. The first and foremost, is the authentication and authorization.  If you do not care about the authorization then you are ok, if not, build the base authorization service and reuse it in all the domain services by adding [RequiredAuthentication] attribute. In the client side also create the main page which knows user information and passes to authentication service before you do data binding.

Second issue that you might run into is the amount of data that is passed over wire. So apply some filtering to the data before you return all the data. You can do the filtering at the server side or on the client side. You can do the filtering in the XAML itself. The simple solution is to add the filter based on some controls. By adding some controls, which binds the values to filtering logic in the data grid will bring only the data you want to show. You can read more about how to apply filtering on XAML at this link.

WebContext and how to make sure client code gets it

When you create RIA services, you want to make sure the ‘WebContext’ is available for the clients to consume the services. WebContext is created by Visual studio from the web project you are pointing to in WCF RIA link. Here are the couple of things you need to do to make sure you are not going run into ‘WebContext’ not found compilation error.

1. First and foremost, check the client side project property and make sure under ‘Silverlight’ tab, the last option ‘WCF RIA Services link’ is pointing to the correct web service project.

2. Enable ‘Show All Files under Solution explorer and find the ‘Generated_Code’ folder and remove everything from there.

3. Restart VS2010 (some times it works too, at least when I was testing with Beta, on some occasions, restarting VS IDE resolve the problem.)

no ‘InitializeComponent’ does not exist in the current context

Today I created a simple Silver Light 4 application and copied a XAML and couple of classes from my existing project. Changed all the references of the old name spaces to new name space and compile it and I got this error. It took me 10 minutes to figure out what was the problem. Simple, I missed one namespace which was still pointing to the old namespace. So if you run into this error message, most probabily you missed one or more name space references to old name space. It seems some other people run into the same problem, if you do not have ‘CompileXAML’ option not set in the MSBuild.