This project has moved. For the latest updates, please go here.

Custom Commands

  • Start by opening the result of the DIY: Simple Scenario (either do it yourself or download it)
  • We are going to implement a way of adding new Person objects to the Persons ViewModel.
  • First add a new user control PersonAdd to the View folder:
<UserControl x:Class="PersonLookup.View.PersonAdd"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             d:DesignHeight="300"
             d:DesignWidth="400">

    <Grid x:Name="LayoutRoot"
          Background="White">
        <Border BorderBrush="Blue"
                BorderThickness="1"
                CornerRadius="3"
                Margin="2"
                Padding="3">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition MinWidth="190" />
                </Grid.ColumnDefinitions>
                <TextBlock Name="textBlock1"
                           Text="First name:"
                           VerticalAlignment="Center"
                           Margin="2" />
                <TextBlock Grid.Row="1"
                           Name="textBlock2"
                           Text="Last name:"
                           VerticalAlignment="Center"
                           Margin="2" />
                <TextBox Text="{Binding FirstName, Mode=TwoWay}"
                         Grid.Column="1"
                         VerticalAlignment="Center"
                         Margin="2,2,119,2" />
                <TextBox Text="{Binding LastName, Mode=TwoWay}"
                         Grid.Column="1"
                         Grid.Row="1"
                         Name="textBox2"
                         VerticalAlignment="Center"
                         Margin="2,2,119,2" />
            </Grid>
        </Border>
    </Grid>
</UserControl>
  • Next add a Property and a Command to the Persons ViewModel in the Persons.xml mapping file:
  <ViewModelClass name="Persons"
                  namespace="PersonLookup.ViewModel"
                  commandClass="MVVM.ActionCommand">
    <Properties>

      <Property name="Collection"
                type="PersonLookup.ViewModel.PersonCollection"/>

      <Property name="NewPerson"
                type="PersonLookup.ViewModel.Person"/>
    </Properties>

    <Commands>
      <Command name="AddPersonCommand"/>
    </Commands>
    
  </ViewModelClass>
  • Press Transform All Templates. If you are interested have a look at the Persons.g.cs to see what was generated for the Command.
  • Add the AddPerson View and a button to the PersonsOverview view:
        <StackPanel Grid.Column="1">
            <Button  Content="Get All"
                     Command="{Binding GetAllCommand}"
                     Margin="2" />
            <my:PersonAdd DataContext="{Binding NewPerson}"
                          Margin="2,4,2,2" />
            <Button Command="{Binding AddPersonCommand}"
                    Content="Add Person"
                    Margin="2" />
        </StackPanel>
  • The code does compile but we did not specify what has to happen when the AddPersonCommand is executed.
  • To do just that open the Persons.cs file and implement the partial method called AddPersonCommandExecute:
        partial void AddPersonCommandExecute(object parameter)
        {
            this.Collection.Add(this.NewPerson);
            this.NewPerson = new Person();
        }
  • The first line adds the new person to the collection of persons.
  • The second line 'resets' the NewPerson object.
  • Note that the NewPerson is not added to the Model nor passed back to the web service. To do that we need a little extra code that will be shown in the tutorial on keeping track of ViewModel Status.
  • The first time the AddPersonCommandExecute is executed the NewPerson property is still null. Because we did not code the property and the constructor of the Persons ViewModel class in placed in the generated partial class it is not so obvious where to initialize this property. The MVMMapper added a call to a partial method in the constructor named ConstructorExecuting.
  • Open the partial Persons class and implement the partial ConstructorExecuting method:
        partial void ConstructorExecuting()
        {
            NewPerson = new Person();
            Collection = new PersonCollection();
        }
  • As you can see the initialization of the Collection property has been added too. So we can start adding Person ViewModel objects immediately without getting the collection from the web service first.

Last edited Jun 13, 2010 at 1:58 PM by Erno_de_Weerd, version 4

Comments

No comments yet.