knom's developer corner : Silverlight

CodeFest-Meals – Silverlight Webcast Series and Sample App

knom — Wed, 09 Sep 2009 16:26:34 GMT

During the last weeks I’ve been working on a Silverlight sample application called “CodeFest-Meals”. The sample application was built for a webcast series we’re doing on www.codefest.at. One of the goals of the application was to have a nice-design. So Wolfgang Hofellner, who is also the artist of Schabus & Knor comics, designed a nice user interface for me.

Normally I’m more of a XAML guy, but for this series I really forced myself to use NO XAML at all. Everything was done within the new Expression Blend 3. And i really need to admit, it was lots of fun! No XAML any longer for me, at least for CodeFest Meals ;-)

If you’re interested in seeing me doing the entire application completely in Expression Blend 3, have a look at our On-Demand or Live- webcast series.

Live Webcasts - Overview over different topics in Silverlight:

On-demand Webcasts – More in depth episodes on Silverlight:

Part 1 – Blend & Sketchflow Introduction

And last but not least

CodeFest-Meals demo online

Btw: I’m doing an event on Silverlight advanced topics in Vienna on September 25th, which will also be recorded. See here for details.

Slides and Demos from BigDays 2009 are online!

knom — Mon, 23 Mar 2009 00:22:00 GMT

These days I'm travelling around austria with our biggest developer & IT Pro event Big>Days 2009!

This year's theme was "packen wir's an" - translated "let's get to work"!

Accompanying the theme we built a multi-tier application with .NET 3.5 and Silverlight called "Rent-A-Worker"!

You can download the sources at http://www.codeplex.com/BigDays09/!

If you're interested in the slides of my four sessoins, feel free to get them here

WPF Day in Dublin

knom — Wed, 17 Dec 2008 17:56:00 GMT

Last week I was in Dublin doing two sessions on WPF for Microsoft Ireland.

They did a "Client-UI Day", where they featured WPF and Silverlight.

The first session was given by the Irish Developer Evangelist Ronan Geraghty, who did an introduction to the Microsoft Client Platform, showing the differences between AJAX, Silverlight, WPF and when to use what.

Next I did a WPF for beginners session, where I showed all the details of XAML, Databinding, Styles, Templates, etc...

Afterwards my colleague Martha Rother from Ireland did a session on Silverlight.

Last but not least I showed how to leverage WPF and Composite WPF Guidance ("Prism") to build business applications.

Overall a really nice event, with around 80 attendees and a lot of interesting ideas and feedback on the Microsoft Client Continuum.

If you're interested in my slides on WPF Introduction and Composite WPF, find them here:

WPF Sessions.zip

Going home from Ireland I took two flights via London.. What a bad choice.. I drove to Dublin Airport at 6:30 am, arriving in Vienna at 5pm :-) Almost half a day of traveling and waiting...

Silverlight Toolkit - December Release

knom — Tue, 16 Dec 2008 13:55:31 GMT

The Silverlight Toolkit is a project built by the Silverlight product team, which contains a lot of "out-of-release cycle" controls.

These are grouped into three parts:

Controls
Charts
Themes

Controls include various nice controls (lots of them already part of WPF):

Auto Complete Textbox
DockPanel
Expander
Label
NumericUpDown
TreeView
Viewbox
WrapPanel

These controls are especially useful if you plan to write business applications. Also they have similar controls in WPF, so if you plan to port your apps from Silverlight to WPF they come in handy as well.

The second part contains a number of various chart controls.

As third part, the toolkit contains a couple of themes, which can be applied to your controls.

Download the Silverlight Toolkit from http://www.codeplex.com/Silverlight/.

A Valuable Tool for WPF and Silverlight

knom — Wed, 03 Dec 2008 12:14:50 GMT

Working with WPF & Silverlight is really great!

The only problem if you use it in production is how you quickly generate new views. They don't need any animations or other stuff, just plain details views.

You could do it with Expression Blend or the Visual Studio WPF Designer, still it would take more time than doing it directly in XAML..

But.. Who is interested in writing 30 or so views in XAML ?!

There is a better solution: XAML Powertoys.

XAML Powertoys are a bunch of Visual Studio 2008 additions which really ease your daily work with XAML (either in WPF or in Silverlight).

Let's say you have an entity Person and you want to create a list view for it.

Just select "Create Form, ListView,.." in the "XAML Power Toys" context menu within the XAML designer.

Next you select the type..

Next you can select the type of UI you want to create (either form, WPF ListView or the new DataGrid control).

You can select the participating data fields from the class and configure how they are bound, etc...

That's it.. The XAML is automatically created and copied into your clipboard. Just paste it at the corresponding position and your UI is ready!

> Get the XAML PowerToys here.

But don't forget to add the install-path to trusted Add-In paths under Tools-Options:

Silverlight 2 Released

knom — Tue, 14 Oct 2008 14:49:17 GMT

Silverlight 2 is finally released!

If you plan using it you need to install three things:

Silverlight Tools für Visual Studio 2008 SP1

Expression Blend 2.0 SP1

Deep Zoom Composer (optional)

The nice thing is, Silverlight Tools not only work in VS 2008, but also in the free version Visual Web Developer Express. Therefore you can develop Silverlight apps for free.

The Silverlight Tools contain everything you need:

The Silverlight developer runtime
Silverlight SDK (docs, additional controls: Tab, DataGrid, Date controls)
Visual Studio Templates, Designer, etc..
ASP.NET Server controls for Silverlight

There is also a Eclipse Tool for developing Silverlight applications. This tools is being developed by Soyatec in cooperation with Microsoft.

If you have used Silverlight before, see the Breaking Changes Document for new features of Silverlight RTM, which break the pre-release API of Beta 2.

That's a good point: Update your Silverlight Beta apps to RTW as soon as you can. They cannot be viewed with the new runtime!

Silverlight 2.0 Upgrade Experience

knom — Tue, 14 Oct 2008 14:33:28 GMT

Silverlight 2.0 was released earlier this day.

If you browse to http://www.microsoft.com/silverlight/ and choose "Install", you will get this nice page (only if Silverlight Pre-RTW is installed on your machine).

Thats cool! The installed runtime version is analyzed and upgrade tips are shown :-)

.NET Roadshow - Demo Solution

knom — Fri, 19 Sep 2008 17:07:00 GMT

The demo solution from our .NET Beginners Roadshow is no ready for download for attendees and all others.

The scenario is event management.

The solution consists of 4 parts:

*) Data Access layer using ADO.NET Entity Framework

*) Business Logic Service hosted as a WCF service.

*) Web Site, written in ASP.NET, which allows attendees to register and view their events, including a

*) Silverlight Web Control

*) Desktop Client using WPF, for managing the events.

Here some screen shots:

Feel free to have a look at the source code here.

Whitepaper - "InfoScreen App with Silverlight 1.0"

knom — Fri, 06 Jun 2008 14:30:00 GMT

One of our mail goals in the Developer & Platform Evangelism is driving adoption of new technologies. To do so we're working with strategic customers which are interested in our stuff and help them implementing projects.

A few months ago we started working with derStandard.at, which is a well-known website in Austria, that is attached to one of the largest country-wide newspapers.

They're looking for new innovative ways to provide their content. That's why they evaluated Silverlight for a new InfoScreen application of theirs.

My colleague Mario Szpuszta and I supported derStandard.at in architectural design and prototyping of their project.

As a conclusion we've written a whitepaper on the architecture of the application and some best practices when working with Silverlight 1.0.

By the time we started the project, Silverlight 1.0 was the stable release of the new platform, that's why we've decided to use the first, JavaScript based version. derStandard.at will update their project to Silverlight 2.0 and so will we update the whitepaper (if you're interested in us doing so).

Feel free to download the whitepaper here and see our experiences with building an InfoScreen application with Silverlight 1.0.

BigDays 2008 - Slides and Demos

knom — Wed, 16 Apr 2008 19:32:55 GMT

Here are the slides and demos of my four sessions at the Austrian Launch Tour "Big>Days 2008".

Sorry for the delay.. I've been in a hurry during the last days.. So following the high demand, here they are :-)

Visual Studio 2008

Language Integrated Queries with C# 3.0

Slides
Demos

Silverlight 2.0

Slides
Demos

Windows Presentation Foundation for Line-Of-Business Applications

Slides
Demos

Silverlight 2 - Feature Overview

knom — Mon, 17 Mar 2008 03:31:14 GMT

Last week in Las Vegas the upcoming version Silverlight 2 was presented.

Right now the Beta 1 is available for download.

As you probably already know, Silverlight is a browser plugin, which needs to be installed once by the end users.

If users get along Silverlight content embedded in a webpage, the app is downloaded and executed locally be the plugin (but displayed in the webpage).

Let me give you an overview of the functionality of the current beta:

.NET Support:

Silverlight 2 has a built in mini-version of the .NET Common Language Runtime. You can therefore build Silverlight 2 applications using C# or VB.NET (and even more..) without having .NET installed on the client before. That's why Silverlight .NET applications also work on the Mac.

Controls:

.NET support enabled a series of controls within Silverlight. Most important, focus handling is now supported - meaning you can control the currently active controls with the TAB key and input text or send other keys to controls.

The collection of built-in controls includes Textbox, Button, ItemsControl, FileOpenDialog as well as layout controls like Grid or StackPanel. The SDK includes other controls (which are not included in the core runtime and need to be shipped with your app), they contain Checkbox, RadioButton, DataGrid, Calendar and more.

Styles & Templates:

Like with WPF you can now style your controls with a collection of property values for colors and other things. Moreover you can change the appearance of controls completely by specifying a control template for it. Data templates for visualization of custom objects are also available.

Databinding:

To bind specific properties to others you can now use databinding.

The sample shows how to bind a property (in contrary to WPF, the Path=.. syntax doesn't work right now). Set the data source with a DataContext property of the control or it's parents.

Networking:

You can either add a web reference to a HTTP or JSON web service or you can download data from any same-domain (or even cross domain) site URL. Client sockets are also supported.

LINQ:

With the help of LINQ to XML (in the SDK) you can query XML data source with the well known LINQ paradigm.

HTML Integration:

As Silverlight is always embedded within HTML it is crucial to provide a good interop story between HTML and Silverlight. You can access HTML objects out of Silverlight as well as access Silverlight methods out of JavaScript.

Local Storage:

Silverlight apps can store information in a local folder (which is somewhere in the user profile). Only the same app can read and write to and from this location. The size is limited, but increase can be requested. This is equal to Isolated Storage on the full .NET FX.

OpenFileDialog:

Local file system access is not permitted except Isolated Storage. With the help of the OpenFileDialog users can grant access to a specific file to the application (e.g. to use it for upload).

DeepZoom:

This technology, formerly known as "Seadragon" allows seamless zooming into high resolution images. Only the necessary parts of the images are transferred to the client to reduce network traffic.

If you want to play around with the current version, these links are essential:

By the way: In Q2 2008 a second Beta will be released, which will allow you to get online with your commercial projects - so start looking into Silverlight now!

MiX 08 Keynote News - Silverlight, IE 8, ...

knom — Fri, 07 Mar 2008 12:57:42 GMT

Wednesday March 5th, Venetian Hotel, Las Vegas. Endless crowds are trying to get into the keynote room of MiX.

The first speaker is Ray Ozzie. As chief software architect of Microsoft, he talks about the overall strategy of Microsoft, providing a platform for consumer media applications as well as business applications over a variety of devices and the web.

Then the first announcement: We will provide what is called Microsoft SQL Server Data Services. Not to be confused with ADO.NET Data Services (Project "Astoria"), the SQL Server DS is an online storage service based on REST and SOAP webservices, which can be leveraged for your own applications. If you're interested in details see the session recording at visitmix.com, available for download later this week, or see Eugenio Pace's blog on this.

After that, Scott Guthrie, VP of developer division took over and started with an outlook to the future of web development with Microsoft:

One of these is the ASP.NET MVC framework, Dynamic Data Support as well as new AJAX extensions.

The next interesting announcement: The availability of Internet Explorer 8 Beta 1. You can already download it here! More details about new features to come on my blog.

Expression Studio 2 - is available as Beta version, with e.g. a great new Expression Web and Expression Blend for Silverlight 1.

To use Blend with Silverlight 2 a new version Expression Blend 2.5 March CTP is available.

Two other interesting announcements regarding Silverlight:

We are currently building a mobile version of Silverlight for use with Windows Mobile 6 devices. The first CTP will be available in Q2 2008 and...

Together with Nokia, Microsoft will provide versions of Silverlight for the Symbian powered devices Nokia S40 and S60 (no timeframe mentioned there).

So get back for the detailed postings on Silverlight 2 and IE 8.

If you are interested in sessions from mix, go to http://sessions.visitmix.com/

Microsoft Popfly is Public

knom — Fri, 19 Oct 2007 17:07:24 GMT

For some time now Popfly has been around as a private alpha. Now it has been opened to public as a beta version of it!
So what is Popfly?! Popfly is a Web 2.0 application allowing consumers (and developers *gg*) to do a lot of cool things.

One part is the Webpage editor, which you can use to build webpages and host them on Popfly - so if you want to build a private website, just use popfly:

The other part, which is even more interesting in my opinion is the Popfly Mashup Builder.

With the Mashup Builder you can create own little applications with the metaphor of building blocks.

Choose a block out of the toolbox and drag it onto the design surface. Each block can hav input values and output values. You can then connect these input and output values to a pipeline of blocks. The exact mapping of input parameters can be done with in a configuration view.

At the end of each pipe there should be same output-block, which generates visuals. Then you can preview your mashup.

For those interested in more development-oriented tasks: Everything is established in background by the use of JavaScript.
So if you want to build more complex mashups, you can tune the code in the so called "Advanced View":

Another option is to build custom blocks, which is also done with JavaScript and a custom XML file for the specification of the input and output parameters.

Later you can share "Mash Out" your application, which can then be embedded into blogs (see upper left corner of my blog) or sidebar gadgets for instance.

By the way: Popfly was developed in Silverlight 1.0!!

So there's lot of fun there, not just for consumers!

I'll soon publish another article on popfly..

LINQ-to-SQL Part 1: "Let me teach you English!"

knom — Fri, 10 Aug 2007 11:42:00 GMT

When using LINQ to SQL you need to create a DBML diagram!

The first step to start with, is clicking "Add New Item".

The item type is now called "LINQ to SQL Classes" in Beta 2 of VS 2008:

Within the diagram designer you can drag tables from the server explorer onto the surface to generate LINQ class for them. If relations exist on the server, they will be automatically created as well.

I did this for my Meeting-Tool. What I got, was this strange class:

MeetingSery ?!? What the hack is this! My table is named MeetingSeries! So I tried it with a sample table named Cars --> renamed to Car.

The LINQ-to-SQL Designer automatically renames plural names to singular names! Unfortunately this doesn't work well for all names ;-)

But - Good news: you can adjust all settings with the property window:

If you save the diagram, a corresponding C# file is generated below the DBML file - called MyFile.designer.cs.

This file includes several classes:

*) The DataContext

This class derives from System.Data.Linq.DataContext and is responsible for managing the database connection. Each table of the database is accessable via a public property of type Table.

The System.Data.Linq.Mapping.DatabaseAttribute specifies the name of the database, the datacontext is responsible for.

*) The table classes

For each table a seperate class is generated, with properties for each table field. The table and the fields are decorated with attributes as well - TableAttribute and ColumnAttribute.

As these classes are partial, it is possible to extend them via partial classes. There are methods defined and called in the auto-generated part, which can be implemented in the custom part to provide custom behavior on special events.

The following statement fetches data from the database:

SqlConnection connection = new SqlConnection(Settings.Default.NorthwindConnectionString);
using (NorthwindDataContext dc = new NorthwindDataContext(connection))
{
   var orderList = (from order in dc.Orders
           where order.ShipCountry == "Austria" && order.ShipCity == "Vienna"
           select order);

   foreach (Order o in orderList.ToList())
   {
        Console.WriteLine("Order {0} to {1}", o.OrderID, o.ShipName);
   }
}

The new LINQ syntax (var, from where, select) is powered by C# 3.0, a new language compiler as well as the System.Linq.dll of .NET 3.5.

See my previous post on C# 3.0 extensions to learn about the basics!

Wait for part 2 of the LINQ series to learn more details ;-)

Transparent Silverlight Sidebar Gadget

knom — Wed, 06 Jun 2007 11:43:00 GMT

To prove the use of Silverlight in Vista Sidebar Gadgets, I recently created a really simple, but good looking ;-) Sidebar Gadget with a Silverlight App embedded!

Here is what it looks like:

Don't bother about the pink animal watch ;-) The gadget basically consists of three circles which are moving around in a weird way!

To build the Silverlight App I used Expression Blend 2 May preview and Silverlight animations (took me about 2 minutes).

The most trickiest part was implementing transparency:

First I wanted to create a gadget with semi-transparent ellipses (to do some kind of color-overlay/mix). This worked well, as long as it happened within Silverlight. Problems occurred with transparency outside of Silverlight, meaning the sidebar/desktop shining through.

Finally I found the trick, how to do it (thanks to Karsten Januszewsky):

What you need to do is insert a <g:background..> tag into your gadget HTML file. This special tag is supported by the Sidebar and allows you to specify a background image for the gadget.

So what I did is set the background image to an entirely transparent PNG file the same size as the gadget.

<g:background src="bg.png" id="Bg" style="position:absolute;width:130px;height:130px;z-index:-1"/>

This way, if you set the background brush of the root-canvas to transparent you'll see the background of the sidebar/desktop shine through!

One problem still left is caused by Anti-Aliasing. This technique smoothes the borders of graphical elements like here the ellipses. So the borders don't get purely yellow or red, but a mixture of both.

Unfortunately because of the hack to host silverlight in a webpage and that page in the gadget, it seems to use Magenta as transparency mask color in this case. So some pixels, mixed with yellow or red are not removed.

Right now, this can only be solved by designing a non-anti-aliased UI or using some background color!

[Update] Also read the updated versions for Silverlight 1.1 here (updated sample is attached there)!