How do I access my viewmodel commands on a Xamarin Forms button?

Question

I have written out some commands for my interface within my viewmodel for my Xamarin Forms project. I need to access these commands on my buttons so that they perform a task however I'm not sure how to do that.

My ViewModel

TheDemo/ViewModel/MenupageViewModel.cs

using System;
using System.Windows.Input;
using Xamarin.Forms;

namespace TheDemo
{
    public class MenuPageViewModel
    {
        public ICommand GoDashboardCommand { get; set; }
        public ICommand GoRequirementsCommand { get; set; }
        public ICommand GoFixturesCommand { get; set; }
        public ICommand GoVesselsCommand { get; set; }
        public ICommand GoDutyBrokerCommand { get; set; }
        public ICommand GoSettingsCommand { get; set; }
        public ICommand GoInfoCommand { get; set; }

        public MenuPageViewModel()
        {
            GoDashboardCommand = new Command(GoDashboard);
            GoRequirementsCommand = new Command(GoRequirements);
            GoFixturesCommand = new Command(GoFixtures);
            GoVesselsCommand = new Command(GoVessels);
            GoDutyBrokerCommand = new Command(GoBroker);
            GoSettingsCommand = new Command(GoSettings);
            GoInfoCommand = new Command(GoInfo);
        }

        void GoDashboard(object obj) {
            App.NavigationPage.Navigation.PopToRootAsync();
            App.MenuIsPresented = false;
        }
        void GoRequirements(object obj) {
            App.NavigationPage.Navigation.PushAsync(new Requirements());
            App.MenuIsPresented = false;
        }
        void GoFixtures(object obj) {
            App.NavigationPage.Navigation.PushAsync(new Fixtures());
            App.MenuIsPresented = false;
        }
        void GoVessels(object obj) {
            App.NavigationPage.Navigation.PushAsync(new Vessels());
            App.MenuIsPresented = false;
        }
        void GoBroker(object obj) {
            App.NavigationPage.Navigation.PushAsync(new Duty());
            App.MenuIsPresented = false;
        }
        void GoSettings(object obj) {
            App.NavigationPage.Navigation.PushAsync(new Settings());
            App.MenuIsPresented = false;
        }
        void GoInfo(object obj) {
            App.NavigationPage.Navigation.PushAsync(new Information());
            App.MenuIsPresented = false;
        }
    }
}

Menu TheDemo/Menupage.cs

using System;
using System.Collections.Generic;
using OxyPlot;
using OxyPlot.Axes;

using OxyPlot.Series;
using OxyPlot.Xamarin.Forms;
using System.Windows.Input;
using Xamarin.Forms;
namespace TheDemo
{
    public partial class MenuPage : ContentPage
    {
        public MenuPage()
        {
            InitializeComponent();
            BindingContext = new MenuPageViewModel();

            Grid grid = new Grid();

            grid.Children.Add(
                        new Button {
                            Text = "Requirements",
                            BackgroundColor = Color.Orange,
                            TextColor = Color.White,
                            Command = //How do I access my commands in my viewmmodel?
                        }, 0, 1);

        }
    }
}

Answer 1

You should set your Button in a variable and then bind it via SetBinding .

Example code:

var ButtonHolder = new Button {
                        Text = "Requirements",
                        BackgroundColor = Color.Orange,
                        TextColor = Color.White
                    };

ButtonHolder.SetBinding (Button.CommandProperty, "GoDashboardCommand");


grid.Children.Add(ButtonHolder, 0, 1);

Answer 2

First of all, map the view model to the view. To do that, add the following line to the ContentPage tag of your view in XAML like this.

The line to add

xmlns:viewModels="clr-namespace:TheDemo.ViewModels; assembly=TheDemo"

Example

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:viewModels="clr-namespace:TheDemo.ViewModels; assembly=TheDemo">

Then add this snippet inside the content page tag

<ContentPage.BindingContext>
        <viewModels:MenuPageViewModel/>
    </ContentPage.BindingContext>

Then add the button and use the command property, like this

<Button Command="{Binding GoInfoCommand}"/>

Update the assembly and namespace according to your application. Hope this solved your issue.