.NET MAUI commands never get executed-CodePudding

I have a view in .NET MAUI that has some buttons like this:

<Button Text="d2" Command="{Binding RollCommand}" CommandParameter="2" />
<Button Text="d4" Command="{Binding RollCommand}" CommandParameter="4" />
<Button Text="d6" Command="{Binding RollCommand}" CommandParameter="6" />
<Button Text="d8" Command="{Binding RollCommand}" CommandParameter="8" />
<Button Text="d10" Command="{Binding RollCommand}" CommandParameter="10" />
<Button Text="d12" Command="{Binding RollCommand}" CommandParameter="12" />
<Button Text="d20" Command="{Binding RollCommand}" CommandParameter="20" />

The data context is set up for the view above:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:DiceRoller2"
             x:Class="DiceRoller2.MainPage">

    <ContentPage.BindingContext>
        <local:DiceRollerViewModel />
    </ContentPage.BindingContext>

    // ...

And the command is defined in this view model:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Input;
using CommunityToolkit.Mvvm.ComponentModel;

namespace DiceRoller2
{
    [INotifyPropertyChanged]
    public partial class DiceRollerViewModel
    {
        public DiceRollerViewModel()
        {
            RollCommand = new Command<int>(Roll);
        }

        public int Dice { get; set; }

        public string Result { get; set; }

        public ICommand RollCommand { get; set; }

        public void Roll(int sides)
        {
            var rolls = new List<int>();
            for (var i = 0; i < Dice; i  )
            {
                rolls.Add(Random.Shared.Next(1, sides   1));
            }
            Result = $"Rolled {Dice}d{sides} and got {string.Join(", ", rolls)} for a total of {rolls.Sum()}.";
        }
    }
}

However, when I run the app, clicking the buttons does nothing; even if I set a breakpoint in the Roll method, it never gets hit, even though a breakpoint in the view model's constructor does get hit.

What could I be missing? Why is the command to roll the dice not executing? The WPF data binding debugging options in Visual Studio don't seem to apply to MAUI, unfortunately...

CodePudding user response：

Firstly, it is recommended that we should use CommunityToolkit.Mvvm when using MVVM in your MAUI project.

And then I think the issue is related to the CommandParameter, it should be a String type instead of Integer. You can refer to my below code snippets:

1. Install the nuget package CommunityToolkit.Mvvm in your project.

2. View: MainPage.xaml

   <Button WidthRequest="100" HeightRequest="50" Text="Add" Command="{Binding RollCommand} " CommandParameter="22"></Button>

In code-behind, don't forget to use binding with ViewModel:

    public MainPage()
    {
        InitializeComponent();
        BindingContext = new DiceRollerViewModel();
    }

3. ViewModel: DiceRollerViewModel.cs

When using MVVM, the VM should implement the ObservableObject as below:

using CommunityToolkit.Mvvm.ComponentModel;
using System.Diagnostics;
using System.Windows.Input;

namespace MauiApptest01
{
    public class DiceRollerViewModel : ObservableObject
    {
        public ICommand RollCommand { get; set; }

        public DiceRollerViewModel()
        {

            RollCommand = new Command<string>(Roll);
        }
        private void Roll(string sides)
        {
             Debug.WriteLine("Answer: This is a test "  sides);
        }
    }
}

4. When clicking the button, the command is being triggered in your debug output like below :

Answer: This is a test22