| Comments

I was talking with a good friend the other day about some feedback about DataForm.  It’s great to get raw and honest feedback…that’s where you improve more than ‘it sucks’ type feedback.  One of the use cases he felt would be common with the Silverlight DataForm control (available in the Silverlight Toolkit) was the concept of confirming the delete action.  I agreed as well that confirming permanent delete actions is a common line-of-business application pattern.  It got me thinking about some things…

The Problem

DataForm is a great control.  I love it.  It will benefit many developers in the simplest applications quickly as well as some in the most complex applications with some additional configuration.  For the purposes of this demonstration, I’ll talk about the simplest scenario.  DataForm has build in controls for navigating a bound data set, as well as adding and deleting new items.  It is the deleting I’d like to concentrate on here. 

When DeleteItem is called on DataForm (via the built-in toolbar or via your own methods), it deletes the current item.  After all, that’s what you told it to do!  The problem is that the delete is fast and there is no easy “undo” method. 

The Helper

Luckily, DataForm provides a method interceptor for us: DeletingItem.  This event fires when DeleteItem is called and tells you: Hey, I’m about to delete the current item.  If you want to do anything about that, now is the time.  So there you have it…you can prevent the delete because there is a CancelEventArgs parameter passed in to cancel the remaining event.  So what would you do in DeletingItem?

Solution 1: Go modal

One thing you can do is leverage a modal dialog.  This would block the event until a modal dialog response is provided for you to investigate.  Here’s an example of what you might do in DeletingItem:

   1: private void PeopleBrowser_DeletingItem(object sender, System.ComponentModel.CancelEventArgs e)
   2: {
   3:     if (MessageBox.Show("Are you sure you want to delete this item?\nThis cannot be undone", "Delete Item", MessageBoxButton.OKCancel) == MessageBoxResult.Cancel)
   4:     {
   5:         e.Cancel = true;
   6:     }
   7: }

So what’s the problem with this one?  Nothing really.  The dialog would show, giving your user a chance to react and block the delete call until an OK is received (it cancels the event if Cancel is clicked).  But let’s look what it generates from a user experience standpoint:

confirm delete with MessageBox

Hmm, maybe there is a problem.  First, it says OK or Cancel…not really a “Yes or No” response the user is really looking for.  Second, using MessageBox will focus the dialog in the center of your window and not center of parent (or calling control).  These two things make it less ideal in my opinion.  The major positive here is twofold: it works and it’s truly modal (thus blocking the call to delete).

Solution 2: Pimp your dialog, but also your code

Silverlight is all about improving the user experience right?  Changing things around and differentiating the RIA?  So let’s use that mantra to think what we could do here.  Silverlight 3 provides a new control, ChildWindow that you could use in this instance.  It provides a modal-like experience to the end user (blocking other UI components) and gives them a focused area to provide a response.

NOTE: I’ve refactored ChildWindow into something I call “FloatableWindow” for MDI or other type interfaces.  I’ve provided my code for you to use on the .  I’ve also added a work item on the Silverlight Toolkit so if you like the idea, please vote on it!

The challenge with ChildWindow is that while it exhibits all the UI experience of a modal dialog, behind the scenes it is asynchronous.  This means that if you put a Show() call to a ChildWindow in your code, that your next line of code will run as well.

NOTE: If you think this should be changed, consider voting on the Silverlight Toolkit project for this item: ChildWindow – make it modal.

We can, however, still be creative.  Let’s explore an idea here.  We know that we have the DeletingItem event we can still tap into, so we can trigger our implemented ChildWindow like this:

   1: private void PeopleBrowser_DeletingItem(object sender, System.ComponentModel.CancelEventArgs e)
   2: {
   3:     ConfirmDialog cd = new ConfirmDialog();
   4:     cd.Show();
   5: }

The problem is that unless we cancel the event, the delete will still happen (and you can see it happen from behind the ChildWindow even…frustrating!  The ChildWindow.DialogResult is essentially worthless to us right now.  Let’s think creatively though.  What I did was create a member variable called _delete and set it to false.  This tells the DeletingItem event whether or not it really should delete.  It sounds dumb, I know, but work with me.

Now when we call DeletingItem, we check to see if we really should delete or not (really we check to see if we should cancel the event).  If we are still in “false” mode, then we shouldn’t delete but should show our confirmation window and cancel the DeletingItem event.  That’s great, but we still need to get the user response from the window!  We then need to tap into the ChildWindow.Closed event and get the DialogResult from there.  In the Closed event we can see if they confirmed the delete.  If they cancelled the delete, we do nothing further.  If they said “Yes” then we need to change our _delete variable and call DeleteItem on our DataForm again.  Now our DeletingItem handler knows we can successfully continue.

Sound fuzzy?  Sound like a hack?  Maybe so, but it works.  This gives us the opportunity to create a customized user experience for the confirmation.  Now I’m a crappy designer, but to make the point clear to differntiate from simple MessageBox, my ChildWindow has a flashing background and blurs the DataForm.  Yeah, it’s obnoxious, but that is the point for this demonstration!  Here’s the complete code for this solution:

   1: private bool _delete = false;
   3: private void PeopleBrowser_DeletingItem(object sender, System.ComponentModel.CancelEventArgs e)
   4: {
   5:     if (!_delete)
   6:     {
   7:         Person p = PeopleBrowser.CurrentItem as Person;
   8:         ConfirmDialog cd = new ConfirmDialog();
   9:         cd.Closed += new EventHandler(cd_Closed);
  10:         cd.Title = string.Format("Delete {0} {1}?", p.FirstName, p.LastName);
  11:         BlurEffect b = new BlurEffect();
  12:         b.Radius = 10;
  13:         PeopleBrowser.Effect = b;
  14:         cd.Show();
  15:         e.Cancel = true;
  16:     }
  17:     else
  18:     {
  19:         _delete = false;
  20:     }
  21: }
  23: void cd_Closed(object sender, EventArgs e)
  24: {
  25:     PeopleBrowser.Effect = null;
  26:     ConfirmDialog cd = sender as ConfirmDialog;
  27:     if (cd.DialogResult == true)
  28:     {
  29:         _delete = true;
  30:         PeopleBrowser.DeleteItem();
  31:     }
  32: }

You can try this out yourself here (requires Siliverlight 3): Sample confirm delete with DataForm.  Go ahead, I’ll wait. 

Obnoxious isn’t it :-).  Of course using Expression Blend to customize your own is highly recommended!


While there is no true modal dialog in Silverlight other than MessageBox (which isn’t XAML-customizable), these are two options that provide you with the opportunity to confirm your delete action within DataForm.  Hopefully these are helpful to get you to think at least and if someone has better implementations, please share them!  You can download the complete code for this sample here: ConfirmDeleteDataForm.zip

Hope this helps!

| Comments

There seems to be a lot of buzz around Silverlight lately and I admit, I like it :-).  But I also think that there is a huge misconception about Silverlight “replacing” WPF.  I get emails a lot about people asking me questions about Silverlight and after a bit of prodding, I see that their target platform for their application is Windows.  I then begin my rant on why it should be WPF if that is the target platform.  I’m usually met with some weird looks being that I do a lot of Silverlight, but I state my case accordingly.

The conversation usually follows about not understanding WPF or trying to find more information about it.  Well, the WPF teams are trying to change that perception.  In fact, Jaime Rodriquez and Karl Shifflett have been organizing a WPF LOB Tour to provide 2 days of free WPF training for developers.  Jaime is the technical evangelist for WPF and Karl works on the WPF team.  They will be in these cities soon:

  • Los Angeles, CA
  • London, UK
  • New York, NY
  • Chicago, IL
  • Phoenix, AZ

Take a look at what they’ll be covering about WPF:

  • Day One:

    • Lap Around WPF
    • WPF Tools ( Blend, Visual Studio 2008)
    • Graphics Subsystem
    • Layout
    • WPF Fundamentals and new concepts
      • Application Model
      • Dependency Properties
      • Trees (logical & visual)
      • Events
      • Threading
      • Resources
    • Controls
    • Styling
    • Templating
    • Q&A with instructors at end of day
  • Day Two:
    • WPF integration with Win32 and Windows Forms
    • Data binding
    • Introduction to Model-View-ViewModel
    • Commanding in M-V-VM
    • Views, Navigation and Transitions
    • Data Validation
    • Error handling, Model dialogs, Logging
    • Unit Testing
    • MVVM & LOB tips and tricks
    • Q&A with the instructor
  • If this is coming to an area near you, I’d strongly encourage you to make the time to be there.  There is no cost to you other than getting yourself there (if it isn’t in your same city).  Their first event packed a full house on registration within 2 hours and the feedback from the training was overwhelmingly positive and exciting.  Karl is such a dynamic and fun guy to be around, it will be worth your price of admission to hang out with him and Jaime for 2 days.  I’d love for one city to rally together and all show up wearing Hawaiian shirts to make Karl feel at home :-).

You can find all the information about the events on Karl’s blog or Jaime’s blog.  Registration links and everything are listed there.  If you have a question about the event, please reach out to Karl or Jaime.  I know their most asked question is "why aren’t you coming to <fill-in-the-blank-location>?  Honestly after talking to Karl I’m convinced he wouldn’t sleep if he could go everywhere…and he wants to as well!  I think there are some plans to do some studio recordings and produce the information online, but there is no timeframe for that just yet…and I do believe that nothing really supplements being able to network with others learning and being in-person to ask questions, etc.  It’s a great opportunity to learn and demystify WPF development for yourself…really, make the time to be there.

Additionally, there have been some organized XAMLFest events happening around the country (US – but if there are others worldwide, leave a comment where they are happening).  These aren’t 2-day workshop trainings, but are events organized around our XAML technologies, specifically WPF and Silverlight. 

I think WPF and Silverlight are really great technologies and compliment each other well.  Try not to learn one without the other.  I know personally I’m trying to do more WPF learning myself as the natural progression of the Microsoft platform is the continuum of Silverlight to WPF as shared application platforms.  I hope you’ll do the same.

If you’ve attended one of these WPF events listed above, please leave a comment about your feedback as well. 

| Comments

Okay, about a month ago I was shown this demonstration by my new favorite friend Ward Bell of IdeaBlade.  Why is he my new favorite friend?  Well besides being a great guy, wait till you see what he has to show you.  I briefly alluded to my excitement via Twitter as a teaser. 

I previously mentioned that we saw some sneak peeks of Silverlight 3 added features for line-of-business application development with Brad Abrams.  Today, check out what Ward has to show you:

Get Microsoft Silverlight

I am really, really excited about this platform that Ward showed me and I think that you will be as well.  Watch the video and show how easy it is to use their framework to enable rapid business application development with data.  Visit their DevForce for Silverlight page for information and to sign up for the March 2009 Release Candidate.  It’s chalk full of great features including client-side data caching binding to anonymous types and easy validation customization.

Ward will be at and you must grab him for some personal demonstration.  Hopefully we can convince him to grab some common area and chat with a group of people.  He’ll gladly answer all your questions and even accept your jabs if you have them.  He’s just returned from the Alt.NET conference in Seattle as well and hopefully can share some thoughts around that with regard to Silverlight and this framework.

Honestly, check this out.  What do you think?  Sign up for the RC.

| Comments

Want some sneak peeks at Silverlight enhancements for line-of-business applications?  Check out the video with Robert Hess and Brad Abrams where Brad shows some some sneak preview of some feature enhancements.

Get Microsoft Silverlight

If you want to download the episode above, visit the Channel 9 page here.  Be sure to stay tuned for MIX09 for more announcements and updates!

| Comments

The other day I was given a peek at a company who implemented a full-frame Silverlight application that when I saw it it was one of those “wow” moments.  A lot of the public-facing Silverlight examples are very different from one another and sometimes you see some that are full Silverlight applications that really give you a glimpse of how people are thinking about using the platform and how creative you can get.  Colaab is one such example that I saw at PDC last year (check it out if you haven’t).

Another example is a recent one called SnapFlow.  SnapFlow itself is a tool to really make creating workflows simpler to the end user.  The way they have designed their product makes it easy to understand how to create a decision-driven workflow that can be exposed to your users (customers, employees, etc.).  Essentially they separate the workflow into Stages, Actions and Data – all integrated into a user interface that if you are an Office user, you would have no problem understanding.  The best part is…the entire user interface is Silverlight.  Take a look at the screen below:

All of that design surface is Silverlight with full drag around behavior, connecting stages together in a visual, intuitive manner.  The application is very responsive and incorporates a lot of features.  I highly recommend you view the simple walk through video below for a view into all of the features…everything you see is Silverlight:

What is cool in one of the features is that once you, the creator of the workflow, are complete, you can then deploy that workflow into your web site or other portal (the demonstration shows using Sharepoint for example).  So you could develop a workflow for gathering some data from your web site, and embed the generated Silverlight application on your site with absolutely no coding required on your part.  Your employees will be able to act upon that workflow given the permissions assigned to them which then triggers the next part of the workflow (duh, it’s a workflow!) based on the action chosen.

It’s a convenient use of workflow, both simple and complex.  I am really impressed with the use of Silvelright and how responsive and fluid the user experience is.  I have walked through the application a few times and send my beta feedback on some things that I’ve seen from a general usability standpoint and the company was responsive.

The team at SnapFlow also put up a blog, where one of their first posts is: Why Silverlight?  It is an interesting read from a customer standpoint demonstrating some of the pros/cons in their decision and use.

SnapFlow is in beta right now and you really can’t appreciate it just looking at a screen shot.  Sign up for the beta and try it out yourself to see how they’ve used Silverlight to implement these types of usability features.  It uses a lot: controls, user interaction (drag/drop), popup modals, data input/validation, connecting objects, etc. – it’s a great example.  Sign up for the beta to play around with it.