Two Model-View-ViewModel Screencasts

I have great news for anyone who is interested in learning how to create MVVM applications, either in WPF or Silverlight!  Craig Shoemaker, host of the Polymorphic Podcast and Pixel8 podcast, recently published two screencasts that show how to build MVVM applications from the ground up.  I am the guest on the WPF screencast, and Tim Heuer leads the way in the Silverlight version.  I think that the WPF screencast is a great complement to my ‘WPF Apps With The Model-View-ViewModel Design Pattern’ article.

Also, if you are interested in User Experience Design Patterns (which you should be if you are a professional front-end developer!), be sure to check out Craig’s podcast about Quince, with Ambrose Little.

Here are the links:

Implementing Model-View-ViewModel in WPF

Implementing Model-View-ViewModel in Silverlight

Implementing MVVM & Exploring UX Design Patterns

Enjoy!

Advertisement

Using ContentControl3D and Panel3D in a ListBox

In my previous blog post I introduced a new control that I have been working on called ContentControl3D.  Back in May of 2008 I wrote a CodeProject article about a custom layout panel that arranges and animates 2D elements in 3D space, called Panel3D.  Tonight I combined ContentControl3D and Panel3D to create an improved version of my WPF Disciples Blog Roll 3D application.

In order to make this application work, I had to enhance ContentControl3D by exposing more properties and methods in its public API.  This version of the control is much better than the version posted previously.  For example, you can now configure the camera used to view the 3D scene by setting the CameraPrototype property, and specify where the camera should move to during an animated rotation by setting the CameraZoomDestination property to a Point3D object.  The following class diagram shows the API:

The 3D blog roll application now truly feels like a 3D experience.  Not only is each blogger’s information hosted in 3D space, but each “tile” of information can rotate 180 degrees to reveal more details about a blogger.  After navigating to a blogger in the list and clicking on his/her picture, that blogger’s tile rotates and looks like this:

Each ListBoxItem in the ListBox is assigned a custom ControlTemplate via the ItemContainerStyle property of ListBox.  That template creates a ContentControl3D, which hosts two UserControls, one on each side of the 3D surface (i.e. the “tile”).  The template declaration is listed below:

You can download the source code here: WPF Disciples Blog Roll 3D (Source Code).  Note: Be sure to change the file extension from .DOC to .ZIP and then decompress it.

Introducing ContentControl3D

A couple years ago, Ian Griffiths blogged about a way to create flippable list items in WPF.  His approach involves using a VisualBrush to display the 2D content in 3D space, because he implemented it before Viewport2DVisual3D was introduced in .NET 3.5.  Also, his approach was not very easy to reuse in many applications because the functionality was not placed into a custom control.  Tonight, I decided to remedy this by making use of Viewport2DVisual3D in a reusable control.

The code associated with this post is a working prototype.  I intend on turning this into something more complete, but want to share it with the world as soon as possible, hoping to get some feedback and feature requests early on.

I created a control that derives ContentControl, called ContentControl3D.  It allows you to assign the BackContent property to specify what should be shown after you first flip the control over.  The Content property, inherited from ContentControl, specifies what to display on the front side of the surface.  You can also assign the BackContentTemplate property a DataTemplate, if BackContent is set to a data object (instead of a visual element).

Here is a screenshot of the demo application when it first loads up:

After clicking the “Flip Over” button, the UI performs an animated rotation, leaving you with a view of the back side of the surface.  This is shown below…

Naturally, you can put whatever content you want on the front and back sides.

Here is the XAML which configures the ContentControl3D in the demo window:

If you would like to check this control out, you can download the source code here: ContentControl3D Source Code.  NOTE: Be sure to change the file extension from .DOC to .ZIP and then decompress the file.

Your feedback is welcome.  Thanks!

My Blog Hibernation Is Coming To An End

My blog has been pretty quiet recently.  I have received some e-mails from folks, asking if I’ve thrown in the towel, or if I’m alive, etc.  Let me just clear the air…

Over the past couple of months, I have not been able to write much.  My job has been keeping me very busy, we went to Hawaii for a while, I hit a rough patch in my personal life, and I got sucked deeply into some great books about American history.  Add all of that together, and there’s very little time left for WPF blogging, unfortunately.

While at a bar out in Hawaii, one of my readers recognized me from his table and we ended up having a great conversation.  That was really cool!  Tony and I were talking about lots of interesting things.  At the end of the conversation he pointed out that I haven’t been blogging much recently.  When a stranger you meet on vacation points out that you haven’t been blogging much, you know something is wrong!  😀

So, with that said, I just want to let you know that I’m excited to start cranking out more content right here!  Stay tuned…

By the way, our trip to Hawaii was fantastic. If you have never been there, I highly suggest it!  Here’s a picture of my girlfriend and me enjoying the warm winter sun of Oahu.

Aloha!