Marking an item as complete using a command

We need to add a functionality that allows us to toggle items between complete and active. It is possible to navigate to the detailed view of the to-do list item, but this is too much work for a user. Instead, we'll add a ContextAction item to ListView. In iOS, for example, this is accessed by swiping left on a row:

1. Open ViewModel/TodoItemViewModel.cs.
2. Add a using statement for System.Windows.Input and Xamarin.Forms.
3. Add a command to toggle the status of the item and a piece of text that describes the status:

public ICommand ToggleCompleted => new Command((arg) =>
{
    Item.Completed = !Item.Completed;
    ItemStatusChanged?.Invoke(this, new EventArgs());
});

Here, we have added a command for toggling the state of an item. When executed, it inverses the current state and raises the ItemStatusChanged event so that subscribers are notified. To change the text of the context action button depending on the status, we added a StatusText property. This is not recommended practice because we are adding code that only exists because of a specific UI case to ViewModel. Ideally, this would be handled by the view, perhaps by using ValueConverter. To save us from having to implement these steps, however, we have left it as a string property:

1. Open Views/MainView.xaml.
2. Locate the ListView.ItemTemplate node and add the following ViewCell.ContextActions node:

<ListView.ItemTemplate>
    <DataTemplate>
        <ViewCell>
            <ViewCell.ContextActions>
                <MenuItem Text="{Binding StatusText}" 
                          Command="{Binding ToggleCompleted}" />
            </ViewCell.ContextActions>
        <Grid Padding="15,10">
        ...
        </Grid>
    </DataTemplate>
</ListView.ItemTemplate>