Using the SplitButton control in your Silverlight 4 Application
What is the SplitButton?
The SplitButton is a nice control that allows you to turn one button into many different
SplitButton from Silverlight Toolkit
click options. For example, you might have a Save button, with a split section that drops down with options to Save-As, Save a Copy, etc.
SplitButton Examples
SplitButton Samples
SplitButton Samples
Where can you get the SplitButton control for Silverlight 4?
The SplitButton is available for free in the Silverlight Toolkit. You can download the latest Toolkit from Codeplex.
Steps for using the SplitButton in a Silverlight 4 project
1. Download the latest Silverlight Toolkit from CodePlex.
2. Download the SplitButton Samples and SplitButton Project
3. Add references (right click References) to the Silverlight toolkit and the SplitButton.dll in your Silverlight project.
SplitButton.dllSystem.Windows.Controls.Input.Toolkit.dll
4. Add both namespaces to your XAML, for the Silverlight toolkit and the new SplitButton.
xmlns:splitButton=”clr-namespace:Delay;assembly=SLTKSplitButton”xmlns:toolkit=”clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Input.Toolkit”
5. Add the Split Button code. This makes one button that drops to three options.
<splitButton:SplitButton x:Name=’Button1′ Content=”Open” Click=”Button1_Clicked”><splitButton:SplitButton.ButtonMenuItemsSource><toolkit:MenuItem Header=”Open” Click=”Button1_Clicked” /><toolkit:MenuItem Header=”Open read-only” Click=”Button1_ClickedRO” /><toolkit:MenuItem Header=”Open as copy” Click=”Button1_ClickedAC” /></splitButton:SplitButton.ButtonMenuItemsSource></splitButton:SplitButton>
6. Add Csharp code for click handlers for main button click or any of the three sub-option clicks.
private void Button1_Clicked(object sender, RoutedEventArgs e){MessageBox.Show(“Opening document normally…”);}private void Button1_ClickedRO(object sender, RoutedEventArgs e){MessageBox.Show(“Opening document read-only…”);}private void Button1_ClickedAC(object sender, RoutedEventArgs e){MessageBox.Show(“Opening document as a copy…”);}
7. Give thanks to David Anson, a Microsoft developer who works with the Silverlight, Windows Phone, and WPF platforms. Twitter: @DavidAns
Summary of SplitButton Usage
Using the SplitButton is similar to using other tools in the Silverlight Toolkit, you simply need to add references to the toolkit, and to the button itself, and then you can code the XAML by referring to the xml namespaces you added.
Sincerely,
Rich (aka DisplacedGuy)
One response
Great article, I’ve been wanting to use the split button of the Silverlight tooklit for a while. Love the look of your site and two column layout it looks good on my mobile too.