Adding Sample Data in Blend

 

As many of us, I like to go back to basics from time to time, specially if I been a bit away from a certain technology. Although I have been doing a lot of posting about Windows 8, Surface 2.0 and Windows Phone, I haven’t talked much about Silverlight.

I started working with Silverlight from the very beginning, back when it was called WPF/E. The newest version, Silverlight 5 was released a couple of months ago, in December. I should have been paying more attention to it, but hey….time is not enough for so many cool things at the same time after all !

While I try to find more time to talk, review and share Silverlight 5 features, I wanted to do a post about how to add sample data into your Silverlight application using Expression Blend.

I want this to bit a bit more visual and less text, so here we go !

Open Blend and create a new Silverlight project…

On the right panel, go to the Data tab. Click on the arrow next to the data icon and select “New Sample Data”…

Enter a name for this sample data set…

Blend will create your sample data collection in the Data tab. Click on the data icon in the collection element to edit the sample data records…

Blend sample values window allow to select the sample data properties to display, along with their type and format giving you great flexibility for sample data generation out of the box…

Now here is a cool feature. Once you have your data generated, close the window. Now go to the collection element in the Data tab, click and hold the collection element, and drag it to the “Objects and Timeline” tab. Blend will create a ListBox element for you on the fly to display the sample data….

Run the project (F5) and you will see your Silverlight application running with your generated sample data.

This is by old means an old topic. I did a presentation about this back in 2010 for my colleagues. The most excited ones where actual designers ! Have you noticed that following the previous steps you created a Silverlight application without having to write a single line of code?

Of course, this is nothing compared to the power of the Silverlight platform and the .NET framework. This is sometimes mistaken by people who are not experienced developers. It is easy to put together shiny things quickly using tools like Blend. Is a completely different thing to create robust, scalable and responsive Silverlight applications, and for that you need the experience and knowledge of experienced .NET developers.

Anyways, check out what you can do with a few simple modifications on the sample data generation.

Open the sample data collection and change the second property to an image type and load the sample images from a local folder (ideally should be the project sample images folder)…

Here is the final result…with a few touches on the XAML so the ItemsPanelTemplate is an horizontally oriented StackPanel !

 

The Sample Data generation in Blend works for any kind of supported applications, including WPF and Windows Phone apps. You can generate sample data using random patterns based expressions as I have show you, but you can also generate sample data from XML files or a database. This is a really helpful tool for designers and developers to stylize and test the application without the lower data access layers that might be just under development at that point, and of course is also really useful.

Expression Blend is arguably the best user interface development tool out there, although it is exclusively for .NET and now WinRT application development, which recently seems to be gaining more traction and interest from the industry.

Cheers!