On of the new user controls which is being released with WinRT/Metro is the ToggleSwitch which can be found in the Windows.UI.Xaml.Controls namespace.
When rendered the control looks like below.

By looking at the above you can see 3 distinct data points.
- The header (value of Font Size) – Header=”Font Size”
- The off/on content (value of small) – OffContent=”Small” or OnContent=”Large”
- The value of the actual toggle (off in above) – IsOn={Binding IsLightSelected, Mode=TwoWay}
When you use this control you have the ability of course to either hard wire your values for Header/On/Off or you can use Binding (aka MvvM) to set them. Also If you want to know the selected state you will want to pay attention to the IsOn property, which of course you can bind to (make sure you enable it as TwoWay binding as show above).
Of course you can make other changes to this control via XAML (or code behind). These changes include setting the FlowDirection and the OffContentTemplate/OnContentTemplate which allows you to change the layout/look and feel.
This is a pretty nice UI control and as you can see if pretty simple to use.
Till next time,
Posted
10-25-2011 6:21 PM
by
Derik Whittaker