Silverlight Twitter client

BESUG organized a workshop on Silverlight 3.0 yesterday at the buildings of Boulevart in Schelle.  First of all, I like to thank the people of Boulevart for the nice welcome and all the catering they provided!! You can check out the pictures at http://www.flickr.com/photos/boulevart/sets/72157622332029860

For the workshop, I’ve created a Silverlight Twitter client which shows some new features of Silverlight 3.0.  This application uses a WCF service which communicates with Twitter.  The following Silverlight 3.0 features are used in this application:

  • Resource Dictionary
  • ChildWindow and WrapPanel (from the Silverlight toolkit)
  • Blur effect
  • Behaviors
  • Out of Browser

You can download the source code here.

Advertisements

ReMix 2009

What’s it all about?
ReMix brings the best of MIX09 in Las Vegas to Belgium: it bring us international speakers presenting on the best of MIX09, as well as local cases, with a story focus on User Experience (UX). Since last year’s first MIX event in Belgium there have been enormous advances in the web and RIA space at Microsoft. This is your chance to get a closer look at the new stuff as well as deepen your current skills.
Did you hear about UX@Vitra in June this year? This event will bring what you asked for: more in-depth sessions focused around RIA and web design and development.

At REMIX09 you can:

  • Learn about what Microsoft is bringing in terms of new user experience and technologies for building rich web applications and web sites.
  • Attend sessions on Expression Blend, SketchFlow, Silverlight, Surface, User Experience and Natural User Interface.
  • Attend technical sessions on Silverlight 3, building RIAs and ASP.NET.

Who should attend?
REMIX draws together web developers, creatives, information architects, visual designers, UX professionals, and digital marketers who all SHARE AN INTEREST ON WHAT IS COMING NEXT ON THE WEB.

remix09banner

Printing in Silverlight 3.0 using WritableBitmap

It is possible to print reports or other things in Silverlight when you use the new features of the Silverlight 3.0.  The feature you need is called WritableBitmapGill Cleeren wrote a nice sample about how to print in Silverlight 3.0.  You can read and test it on his blog.  You can also do other nice stuff with a WritableBitmap like creating your own flashy bitmaps.  René Schulte has a good blogpost about creating effects and doing a performance test.

I also created an application to take screen shots using the WritableBitmap class.  I showed this demo on the Community Day 2009 and you can download it here.

My new Silverlight 3.0 user control: rotating menu

I’ve just finished a Silverlight 3.0 user control which is a menu.  The concept is very simple:
Several items are rotating in a circle.  The items are buttons by default, but you can change the ControlTemplate and use an image, mediaelement, rectangle,… as an item.  When you click an item, they will stop rotating and be placed in one line.  If you click an item again, they go back to their previous status. 

screenshot rotating menu

The control has 2 public properties:

  1. Radius: sets the radius of the circle.  How bigger the radius, the bigger your circle
  2. MenuItems: this property asks for a collection of MenuItems.  These MenuItems are just buttons with some extra properties.  If you change the ControlTemplate of the MenuItem control, you can use anything as a menu item.

You can download this control and the source code from the Expression Gallery.  Feedback to improve this control is welcome or let me know if you did some improvements.

New Besug site online

The countdown for the release of the new Belgian Silverlight User Group [BESUG] website has started.  The new website should be up and running tomorrow 24th july at 6pm.  Check it out at http://www.besug.be

This website uses some new Silverlight 3.0 features like pixel effects, deeplinking, perspective 3D and validators.

Besug event: Silverlight 3.0 workshop

The beta of Silverlight 3.0 was unveiled at Mix in March this year and has a lot of new interesting features.  BESUG organizes a workshop to introduce you to these features.  The workshop will take place at the Boulevart buildings in Schelle at the 10th of September and endures two hours (from 19h till 21h).

During this workshop we will build a small Silverlight application, showing some of the new concepts like out of browser, animation easing, deeplinking, pixel effects, importing Photoshop files and perspective 3D.

You need to bring your own laptop with the following installed:

  • Visual Studio 2008 SP1
  • Silverlight 3 beta tools for Visual Studio
  • Expression Blend 3 preview
  • The Silverlight 3 toolkit

You can download all these tools from http://silverlight.net/getstarted/silverlight3.  Be sure to subscribe fast at http://www.besug.be because places are limited to 30 people.  This event is free of charge and is organized in cooperation with Boulevart.  Hope to see you there!

New tutorial: a Silverlight 3 Flickr gallery

I’ve created a user control that shows images from Flickr in a circle.  You can enter a search string and the user control will return the results for this search.  The results are shown in textblocks that are positioned in a circle using some basic goniometry.  If the mouse enters a textblock the image is shown in the centre of the circle.  All the images are preloaded after you entered your search string.

flickrscreen2

 

 

 

 

 

 

 

I started with creating the user interface with Expression Blend.  This is just a user control with a textbox, progressbar and a button.  In the user control I also have a canvas that contains an image control.

In the second step I used the Flickr webservice.  The code I’ve used to call the Flickr service is from Brad Abrams blog.  When the service is called I make a clipping mask with an ellipse and the image element.

The third step was to create a textblock for each image that was returned from the webservice and position the textblocks in a circle.  To do this I calculated the x and y position from the angle and radius.  For example:  x = Math.cos(angle * position * 0.0174532925 ) * radius.  I need to multiply with 0.0174532925 because the Math.cos method works with radians instead of degrees.  When I create the textblocks I also preload the images.

After all the images are preloaded I show the textblocks and you can scroll through the images by entering a textblock with the mouse.

You can download the complete source code from http://gallery.expression.microsoft.com/FlickrGallery