Radio buttons binding in .Net MAUI: selected item is not updated in the view model

[DavidShochet]

I have a .Net MAUI app that uses CommunityToolkit.Mvvm.

Here is a part of my view model:

[ObservableProperty]
private DateTime _selectedTime;

public List<DateTime> Times { get; set; } = new ()
    { new DateTime(2000, 1, 1, 9, 0, 0), new DateTime(2000, 1, 1, 9, 30, 0), new DateTime(2000, 1, 1, 10, 0, 0), new DateTime(2000, 1, 1, 10, 30, 0),
      new DateTime(2000, 1, 1, 11, 0, 0), new DateTime(2000, 1, 1, 11, 30, 0), new DateTime(2000, 1, 1, 12, 0, 0), new DateTime(2000, 1, 1, 12, 30, 0),
      new DateTime(2000, 1, 1, 13, 0, 0), new DateTime(2000, 1, 1, 13, 30, 0), new DateTime(2000, 1, 1, 14, 0, 0), new DateTime(2000, 1, 1, 14, 30, 0),
      new DateTime(2000, 1, 1, 15, 0, 0), new DateTime(2000, 1, 1, 15, 30, 0), new DateTime(2000, 1, 1, 16, 0, 0), new DateTime(2000, 1, 1, 16, 30, 0) };

Here is a part of the page:

    <CollectionView 
        ItemsSource="{Binding Times}" 
        SelectionMode="Single"
        ItemsLayout="VerticalGrid, 3">
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <RadioButton Content="{Binding ., StringFormat='{0:hh:mm tt}'}">
                        <RadioButton.IsChecked>
                            <Binding Path="BindingContext.SelectedTime"
                                 Source="{RelativeSource AncestorType={x:Type local:AppointmentSchedulePage}}" 
                                 Converter="{StaticResource DateTimeConverter}"
                                 ConverterParameter="{Binding .}" 
                                 Mode="TwoWay"/>
                        </RadioButton.IsChecked>
                    </RadioButton>
                </Grid>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>

Here is the converter:

    public class DateTimeConverter : IValueConverter
    {
         public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
         {
             if (value is DateTime selectedDateTime && parameter is DateTime itemDateTime)
             {
                 return selectedDateTime.Equals(itemDateTime);
             }

             return false;
        }

         public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
         {
             if (value is bool isChecked && isChecked && parameter is DateTime itemDateTime)
             {
                 return itemDateTime;
             }

             return Binding.DoNothing;
        }
     }

Though I am not sure that the converter is needed in my scenario.

The radio buttons are displayed correctly:

But the SelectedTime property in the viewmodel is not updated, and its setter is not hit. What am I missing?

[IanRawley]

In my experience ConverterParameter can't be bound, so what your Convert() and ConvertBack() methods are actually getting are BindingObjects rather than DateTimes. Try putting a breakpoint in and see what ConverterParameter actually is.

[DavidShochet]

@IanRawley Thank you for your answer. I don't see though that the Converter is even needed, as it seems to handle how the data is displayed, rather than binding selection in the UI to a viewmodel property...

[IanRawley]

You will need one if you want to use RadioButtons, as you need to somehow convert between DateTime and bool. You could potentially do it one way with a DataTrigger, but those are one way and you somehow need to bind the chosen RadioButton back to the selected DateTime.

What you could do is change it to a combo box, or a ListBox to display the possible values and the selecteditem bound appropriately. You wouldn't need a Converter there, although you might want to do something to change the appearance of the items.