In this extension
developed for MVVM Pattern. Most of the XAML control has the command property
for handling the event, but few controls don’t have the feature.
The following control
doesn’t have the command for the selection changed event
Ø Gridview
Ø ListView
Ø ComboBox
Ø FlipView
In MVVM Pattern
manage the event using command, but these are all the control to break the
pattern .In this scenario we need to use dependency property for binding custom
command
SelectionChangedCommand Extenstion
This extension
common for the above mentioned control selection changed event. In this extension
has the selector class which is inheritance from ItemsContol class. The
ItemsControl provides the functionality required to build a control that
includes a collection of displayable items of any type. Selector adds the
ability for one or more of those items to be selected by the user.
SelectionChangedCommand Extenstion Code :
/// <summary>
/// To declare the command
property
/// </summary>
public static readonly DependencyProperty CommandProperty = DependencyProperty.RegisterAttached(
"Command",
typeof(ICommand),
typeof(SelectionChangedBehavior),
new PropertyMetadata(null,
PropertyChangedCallback));
/// <summary>
/// Properties the changed
callback.
/// </summary>
/// <param
name="depObj">The dependency object.</param>
/// <param
name="args">The <see
cref="DependencyPropertyChangedEventArgs"/> instance containing the
event data.</param>
public static void
PropertyChangedCallback(DependencyObject depObj, DependencyPropertyChangedEventArgs args)
{
Selector selector = (Selector)depObj;
if (selector != null)
{
selector.SelectionChanged += new SelectionChangedEventHandler(SelectionChanged);
}
}
/// <summary>
/// Gets the command.
/// </summary>
/// <param
name="element">The UI element.</param>
/// <returns>to return the ICommand.</returns>
public static ICommand GetCommand(UIElement element)
{
return (ICommand)element.GetValue(CommandProperty);
}
/// <summary>
/// Sets the command.
/// </summary>
/// <param
name="element">The UI element.</param>
/// <param
name="command">The command.</param>
public static void SetCommand(UIElement element, ICommand command)
{
element.SetValue(CommandProperty, command);
}
/// <summary>
/// To handle the selection
changed event.
/// </summary>
/// <param
name="sender">The sender.</param>
/// <param name="e">The <see
cref="SelectionChangedEventArgs"/> instance containing the
event data.</param>
private static void SelectionChanged(object sender, SelectionChangedEventArgs e)
{
Selector selector = (Selector)sender;
if (selector != null)
{
ICommand command =
selector.GetValue(CommandProperty) as ICommand;
if (command != null)
{
command.Execute(selector);
}
}
}
XAML Coding
<Grid Background="{StaticResource
ApplicationPageBackgroundThemeBrush}">
<StackPanel Orientation="Vertical" >
<!---Gridview selection changed command-->
<TextBlock Text="gridview" Padding="10" FontWeight="Bold"></TextBlock>
<GridView x:Name="selection" ItemsSource="{Binding Collection}" BorderThickness="1" BorderBrush="White"
Extenstion:SelectionChangedBehavior.Command="{Binding SelectionCommand}"
SelectionMode="Single">
<GridView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding UserName}" Foreground="White"></TextBlock>
</DataTemplate>
</GridView.ItemTemplate>
</GridView>
<TextBlock Text="gridview" Padding="10" FontWeight="Bold"></TextBlock>
<ListView x:Name="List" ItemsSource="{Binding Collection}" BorderThickness="1" BorderBrush="White"
Extenstion:SelectionChangedBehavior.Command="{Binding SelectionCommand}"
SelectionMode="Single">
<ListView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding UserName}" Foreground="White"></TextBlock>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
<TextBlock Text="Listbox" Padding="10" FontWeight="Bold"></TextBlock>
<ListBox x:Name="listbox" ItemsSource="{Binding Collection}" BorderThickness="1" BorderBrush="White"
Extenstion:SelectionChangedBehavior.Command="{Binding SelectionCommand}"
SelectionMode="Single">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding UserName}" Foreground="White"></TextBlock>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<TextBlock Text="ComboBox" Padding="10" FontWeight="Bold"></TextBlock>
<ComboBox x:Name="Combobox" ItemsSource="{Binding Collection}" BorderThickness="1" BorderBrush="White"
Extenstion:SelectionChangedBehavior.Command="{Binding SelectionCommand}">
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding UserName}" Foreground="White"></TextBlock>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
<TextBlock Text="Flip" Padding="10" FontWeight="Bold"></TextBlock>
<FlipView x:Name="Flipview" ItemsSource="{Binding Collection}" BorderThickness="1" BorderBrush="White" Height="200"
Extenstion:SelectionChangedBehavior.Command="{Binding SelectionCommand}">
<FlipView.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding UserName}" Foreground="White"></TextBlock>
</DataTemplate>
</FlipView.ItemTemplate>
</FlipView>
</StackPanel>
</Grid>
