Archive for the ‘ tutorials ’ Category

All of My Silverlight Video Tutorials in One Place (revised again 05.12.10)

This post was commented on by Microsoft’s own Scott Guthrie (the Gu) on 5.31.10

Hello All,

This is a post that keeps growing day by  day so I need to update its postion to be at the top of my blog as the content grows. So, here it is again by popular demand:

49. How to add multiple BitmapEffects to one object in Silverlight:

48. How to build a Slider with a ToolTip that follows the thumb button and displays the value of the Slider:

 47. How to build your very own TutorialCam like I use in my video tutorials!

46. Fire one of two Visual States based on the value of a Boolean variable:

45. How to add Fast Forward to the Silverlight MediaElement:

44. Create a custom ToolTip with a Delay:

43. Create a Silverlight Paging Systems to Load Pages on the Fly:

42. Create a Slide In/Out Navigation Panel:

41. How to use Joe Stegman’s PngEncoder to save an image from your Silverlight application:

40. How to create complex gradients:

39. My Blend IDE series – Part 1 – the Blend Toolbar:

38. My Learn Blend IDE series Part 2 – Layout Controls and User Input Controls:

37. My Learn Blend IDE series Part 3 – The Properties, Projects and Data panels: 

36. My Learn Blend IDE series Part 4 – The Objects & Timeline and States panels:

35. My Learn Blend IDE series Part 5 – Blend’s Animation Workspace – Everything you need to know to create Storyboard Animations –

34. How to make a 3 column ListBox in Silverlight:

33. How to read XML into Silverlight and turn it into Native Silverlight Objects:

32. Create a default Silverlight 4 Out Of Browser app that allows you to create new OOB apps in mere seconds:

31. How to make a forever scrolling Silverligh banner:

30. How to create a Silverlight Color Resource in a ResourceDictionary:

29. How to make an Out of the Browser SL4 Web Browser Applicaiton:

28. Use the new Silverlight 4 Webcam API to create a cool webcam app that even let’s you save images to your hard drive:

27. Use the new Silverlight 4 COM API to make an Out of the Browser application that is able to open a MS Word document:

26. How to make a Timer by using the DispatcherTimer class:

25. Create a Functioning Login UserControl:

24. Use the FarseerPhysics Library to create a Ragdoll with simulated Physics:

23. Create a Sortable ObservableCollection:

22. Create a Silverlight Ragdoll with Simulated Physics:

21. How to create a functioning Silverlight Login UserControl:

20. How to create a Silverlight Timer using the DispatcherTimer class:

19. How to create custom RoutedEvents in Silverlight using Andrew Whiddett’s (IdentityMine) Eventing assembly reference:

18. Use the Silverlight Toolkit’s WrapPanel to create a ListBox that displays three rows of Data:

17. Create a Silverlight custom Silder:

16. How to create a Visual Tree Helper to locate FrameworkElements in the Visual Tree:

15. Using DataBinding to control the Visibility of any Silverlight Object using Blend and Visual Studio:

14. How to create a complete Sketchflow Prototype in Silverlight:

13. Creating a Custom Silverlight Button Just for Designers (using linear and radial gradients, the gradient tool and opacity masks):

12. Creating a Custom Silverlight Button:

11. Creating a Storyboard Helper Class:

10. Importing Photoshop PSD files into Expression Blend 3:

9. Creating Morphing Vector Path Storyboards in Blend

8. Re-Creating a Metallic Logo in Vector using Blend 3
7. Creating Timed Storyboard Animations
6. Using TemplateBinding to Replace a ContentPresenter in a Silverlight Button
5. Working with Data in BLend 3
4. Silverlight 3 Behavior Tutorial Video
3. This Tutorial will teach you how to create a Card Flipping Animation! 

2. Observable Collection Tutorial

1. Silverlight Extended Drag and Drop Behavior:

Enjoy! Victor


New Silverlight Video Tutorial: How to Make a Slide In/Out Navigation Bar – All in Blend

In this video tutorial I show you how to use Behaviors and the Visual State Manager to create a navigation bar that slides in when the user places their mouse at the top of the page and then slides away when they move their mouse away from the navigation.  You can see it yourself in action Here.


My Source:

Enjoy! Victor Gaudioso

New Silverlight Video Tutorial: How to Add Multiple BitmapEffects to One Object

In response to my Twitter buddy Funwithcoding I made this post: In Silverlight you can only add one BitmapEffect (Blur or DropShadow) to one object at a time. But these effects are passed down to their child objects (inheritance).  For that reason we can use a little trick and apply multiple effects to one object (or so it appears).  In this Short two minute video I show you how:

An object with a DropShadow and Blur effect:


New Silverlight Video Tutorial: How to create a Slider with a ToolTip that shows the Value of the Slider

Hello All!

Recently I was asked to make a ToolTip that now only followed the Thumb of the Slider but also showed the value of what the slider was (see image above).  I thought about this and I came up with a pretty quick solution.  There may be other ways to do it but watch the short 1o minute video to see how I did it.

See it in action:


Source Code:


New Silverlight Video Tutorial: How to Fire a Visual State based upon the value of a Boolean Variable

Hello All!

In this short 7.44 minute video I show you how you can, with one line of C# code fire one of two Visual States based upon the value of a Boolean variable, one if it is true or another one if it is false.  This is much easier than evaluating the variable yourself and then firing each VisualState manually.  Enjoy!


My Source Code:

New Silverlight Video Tutorial: How to Create a ToolTip with a Delay

Have you ever needed to have your Silverlight Object’s ToolTip appear after a delay?  Say, two seconds?  Well, if you have done this in WPF you know that it is quite easy but not so for Silverlight.  Until Microsoft adds that property we are just out of luck, or are we? 

Well, after some research I found THIS project on CodePlex called the Advanced ToolTip project.  The author, someone named XavierDecoster has extended the ToolTipService class and added a property called InitialDelay that sets the time before the ToolTip will appear and one called DelayTime that will set how long the ToolTip shows before it disappears.  AWESOME!

So, I made a short, 7 minute video tutorial that shows you how to use this awesome ToolTipService. 

Watch the video here:

Download my source here (the Silverlight.Controls.dll can be found in it):

New Silverlight Video Tutorial: How to Create a Silverlight Paging System to Load new Pages

Toaday I got a comment from a blog reader named Fracisco…I think he wanted to know how to load new pages into a Silverlight website.  Just for him, and because I think many of you have the same problem, I made a video tutorial where I show you how to:

1. Create a Content Holder UserControl;

2. Make two pages called HomePage and AboutUs

3. In App.xaml load ContentHolder instead of MainPage.xaml (the default action of a SL app)

4. Create a SwitchContent method that takes a UserControl as its argument; this method will load the requested page into the ContentHolder control

5. Make a Nav UserControl that has Buttons that load the associated page into the ContentHolder UserControl

6. Add the Nav control to each page

7. Create EventHandlers in the Nav.xaml.cs to load the associated content into the ContentHolder User

8. VIOLA! You will then have a Silverlight paging system that loads any page, on Demand into your MainPage.xaml!


Working Example: (from the source code below)

My Project:

Video: (Running Time: 17 Minutes)

Hi Victor
I’m very new to blend and I need a very basic code to make that button call an hyperlink to create live buttons in blend to be used in Expressions 3 to call the other pages in my site, I try the help in blend (the sample code there only give an error at time to run it) and look in your book Expression blend 3 but I can’t find the answer to to this simple task. Can you help?