Tuesday, 15 November 2011

ComboBox with Live Preview


The Live Preview Pattern

If you are using Microsoft Office 2007 or later, you are familiar with the "live preview" concept. They are using it for all kind of selections like color, fonttype or fontsize. The idea behind this pattern is to give the user an immediate feedback, how the object would look like, if he does the selection, without actually doing it. So he can leave the combo and nothing has changed.

How to use the LivePreviewComboBox Control

I encapsulated this functionality into a custom control called LivePreviewComboBox that provides an additional dependency property LivePreviewItem where you can bind to. The following code snipped explains how to use it:
 
<Window xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:l="clr-namespace:LivePreviewComboBox">
 
    <StackPanel>
        <TextBlock Text="Preview Value:" />
        <TextBlock Text="{Binding LivePreviewItem, ElementName=liveBox}" />
        <l:LivePreviewComboBox x:Name="liveBox"/>
    </StackPanel>
 
</Window>
 
 

No comments:

Post a Comment