The good way to implement logic, when and item is selected in ListBox (MVVM)

Question

So i implent the MVVM (light toolkit) in a windows phone application. I have a ListBox which SelectedItem is binded to the property SelectedArticle. Here below the (very simple) property:

private Article _selectedArticle;
public Article SelectedArticle
{
    get { return _selectedArticle; }
    set
    {
            _selectedArticle = value;
            base.RaisePropertyChanged("SelectedArticle");
    }

}

So what i'd like is to change the view, when and element of the ListBox is checked. Anyway it will be easy to put the changement of the view in the settet, but i'd like to avoid that. So how to do that?

Here the xaml:

    <ListBox IsEnabled="{Binding ListBoxEnabled, Mode=TwoWay}" SelectedItem="{Binding SelectedArticle, Mode=TwoWay}" Opacity="{Binding Opacity, Mode=TwoWay}" ItemsSource="{Binding ArticlesList}" Height="634" Width="456">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <Image
                        Margin="0,15"
                        VerticalAlignment="Top"
                        Source="{Binding Image}"
                        Height="100"
                        Width="100" />
                    <StackPanel>
                        <TextBlock Margin="10,15" 
                                   Width="250"
                                   TextWrapping="Wrap"
                                   VerticalAlignment="Top"
                                   HorizontalAlignment="Left"
                                   FontSize="24"
                                   Text="{Binding Content}" />
                        <TextBlock Margin="20,0"
                                   Width="100"
                                   VerticalAlignment="Top"
                                   HorizontalAlignment="Left"
                                   FontSize="20"
                                   Text="{Binding Id}"/>
                    </StackPanel>
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

earthling earthling · Accepted Answer · 2012-03-30T21:13:52

Do you want something like an interaction trigger?
Add this to your xaml

<i:Interaction.Triggers>
    <i:EventTrigger EventName="Tap">
        <cmd:EventToCommand Command="{Binding EventTapCommand, Mode=OneWay}"/>
    </i:EventTrigger>
</i:Interaction.Triggers>

and then define the RelayCommand in your ViewModel

public RelayCommand EventTapCommand { get; private set; }
public MainViewModel()
{
    EventTapCommand = new RelayCommand(DoSomeCoolStuff);
}

If you need to, you can also pass the selected item from your list, you just need to set the CommandParameter and define your RelayCommand using the item type. I forget the exact binding syntax. Something like:

<cmd:EventToCommand Command="{Binding EventTapCommand, Mode=OneWay}" CommandParameter="{Binding}"/>

public RelayCommand<MyType> EventTapCommand { get; private set; }

The good way to implement logic, when and item is selected in ListBox (MVVM)

3 Answers