Maui .net. RelayCommand when pressing button doesn't fire.

Question

I have VS 2022 preview Version 17.5.0 Preview 1.0
In my project I installed CommuniToolkit.Maui v2.0 and CommunityToolkit.Mvvm V8.0

I created this MVVM test app and when I press the button it doesn't fire.

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:mct="clr-namespace:CommunityToolkit.Maui.Behaviors;assembly=CommunityToolkit.Maui"
NavigationPage.HasNavigationBar="False"
xmlns:viewmodel="clr-namespace:GasPrice_Maui.ViewModels"
x:DataType="viewmodel:ViewModelStartPage"
x:Class="GasPrice_Maui.Views.StartPage">
<ContentPage.Behaviors>
<mct:StatusBarBehavior StatusBarColor="Gray"></mct:StatusBarBehavior>
</ContentPage.Behaviors>
<StackLayout>
<Frame BackgroundColor= "Gray" Padding="18" CornerRadius="0">
<Label Text="Gas Price Converter" HorizontalTextAlignment="Center" TextColor="White" FontSize="36"/>
</Frame>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="240"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="40"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="40"></RowDefinition>
<RowDefinition Height="20"></RowDefinition>
<RowDefinition Height="50"></RowDefinition>
<RowDefinition Height="50"></RowDefinition>
<RowDefinition Height="50"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20"></ColumnDefinition>
<ColumnDefinition Width="300"></ColumnDefinition>
<ColumnDefinition Width="40"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Image Source="gaspump" Margin="30,0,0,0" Grid.ColumnSpan="2" Grid.Row="0" HorizontalOptions="Center" VerticalOptions="Center" HeightRequest="120" WidthRequest="120"></Image>
<Label Grid.Row="1" Grid.Column="1" Text="Price per US Gallone" HorizontalTextAlignment="Center" FontSize="Large"></Label>
<Entry Grid.Row="2" Grid.Column="1" Placeholder="$0.00" Keyboard="Numeric" HorizontalTextAlignment="Center" Text="{Binding PricePerGallone}"></Entry>
<Label Grid.Row="4" Grid.Column="1" Text="Price per Liter" HorizontalTextAlignment="Center" FontSize="Large"></Label>
<Label Grid.Row="5" Grid.Column="1" HorizontalTextAlignment="Center" FontSize="36" FontAttributes="Bold" TextColor="Black"></Label>
<Button Grid.Row="7" Grid.Column="1" WidthRequest="150" HorizontalOptions="Center" FontAttributes="Bold" FontSize="24" HeightRequest="50" Text="Calculate" Command="{Binding CalculateCommand}"></Button>
<Label Grid.Row="8" Grid.Column="1" FontSize="Small" Text="Please allow for a +- 3% margin of error" VerticalTextAlignment="End" HorizontalTextAlignment="Center"></Label>
</Grid>
</StackLayout>
</ContentPage>

using CommunityToolkit.Mvvm.ComponentModel;  
using CommunityToolkit.Mvvm.Input;  
using System;  
using System.Collections.Generic;  
using System.ComponentModel;  
using System.Diagnostics;  
using System.Linq;  
using System.Runtime.CompilerServices;  
using System.Text;  
using System.Threading.Tasks;  
using System.Windows.Input;  
  
namespace GasPrice_Maui.ViewModels  
{  
    public partial class ViewModelStartPage : ObservableObject  
    {     
  
        public ViewModelStartPage()  
        {  
            Debug.WriteLine("Start");  
        }  
  
        [ObservableProperty]  
        string pricePerGallone;  
  
        [ObservableProperty]  
        string pricePerLiter;  
  
  
       [RelayCommand]  
       void Calculate()  
       {  
           Debug.WriteLine("Test");  
            
           Debug.WriteLine(PricePerGallone);  
             
       }  
  
    }  
}  

Answer 1

What do you mean by minimized example?

Answer 2

In the StartPage.xaml.cs file below Initializecomponent() method you have to specify Binding context= new ViewModelStartPage(); Try this it might solve your issue.