Radio Button and CollectionView together do not work correctly

[derek-willis]

Description

The radio group SelectedValue binding does not set any radio buttons to the selected state. I have a page that needs to show the currently selected item when it is displayed but there seems to be nothing I can do to make this happen. Clicking any radio button does set the SelectedValue as expected so that direction works at least. If I change the CollectionView to a VerticalStackLayout and use the BindableLayout attribute instead of the CollectionView ones, it all works, bindings work in both directions, my initial radio button selection is selected and all is fine.

The other issue with CollectionView with Radio buttons is that when selecting buttons one by one from the bottom to the top, the very top button takes 2 taps to make it selected. Again, switching to VerticalStackLayout (BindableLayout) solves this issue too.

.Net 8.0
Visual Studio 2022 version 17.10
Maui.Controls (8.0.40)
Maui.Controls.Compatability (8.0.40)
Community.Toolkit.Maui (9.0.0)

Steps to Reproduce

1. On a MAUI page add a CollectionView with a DataTemplate that has a Radio button.
2. Bind the RadioButtonGroup.SelectedValue to your view model SelectedValue property
3. Bind your BindableLayout.ItemSource to a collection of strings in your view model
4. Add some entries to your collection
5. Set the SelectedValue property to exactly one of the Radio button values
6. run the code
7. Note that NO Radio button is selected
8. Switch to VerticalStackLayout as shown

Link to public reproduction project repository

No response

Version with bug

8.0.21 SR4.1

Is this a regression from previous behavior?

No, this is something new

Last version that worked well

Unknown/Other

Affected platforms

iOS, Android

Affected platform versions

No response

Did you find any workaround?

Yes, switch out CollectionView for VerticalStackLayout as shown below.

<Grid
   RadioButtonGroup.SelectedValue="{Binding Selection, Mode=TwoWay}"
   RadioButtonGroup.GroupName="ClientsGroup"
   Padding="0,5,0,0">
    
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <VerticalStackLayout
        BindableLayout.ItemsSource="{Binding Clients}">

        <BindableLayout.ItemTemplate>
            <DataTemplate>

                <Grid 
                    Padding="20,8,20,8"
                    Margin="0,0,0,2"
                    BackgroundColor="White">

                    <Grid>

                        <Label
                            x:Name="ClientName"
                            Text="{Binding}"
                            BackgroundColor="white"
                            FontAttributes="Bold"
                            VerticalOptions="Center"
                            VerticalTextAlignment="Center"/>

                        <RadioButton FlowDirection="LeftToRight"
                            WidthRequest="300"
                            GroupName="ClientsGroup"
                            Value="{Binding}"
                            HorizontalOptions="End"
                            />
                    </Grid>
                </Grid>
                
            </DataTemplate>
        </BindableLayout.ItemTemplate>
    </VerticalStackLayout>

    <Border Grid.Row="1" HeightRequest="50" Margin="20,30,20,30" Padding="0" VerticalOptions="End" Background="{StaticResource CLOrangeGradient}">
        <Border.StrokeShape>
            <RoundRectangle CornerRadius="25"/>
        </Border.StrokeShape>
        <Border.GestureRecognizers>
            <TapGestureRecognizer Command="{Binding AddKnownClientCommand}" CommandParameter="{Binding Source={RelativeSource AncestorType={x:Type ContentPage}}}" NumberOfTapsRequired="1"/>
        </Border.GestureRecognizers>
        <Label Text="Add Known Client" FontSize="18" TextColor="White" VerticalOptions="Center" HorizontalOptions="Center"/>
    </Border>
</Grid>

Relevant log output

No response

[github-actions]

Hi I'm an AI powered bot that finds similar issues based off the issue title.

Please view the issues below to see if they solve your problem, and if the issue describes your problem please consider closing this one and thumbs upping the other issue to help us prioritize it. Thank you!

Open similar issues:

• RadioButtonGroup.SelectedValue binding not works (#21335), similarity score: 0.82

Closed similar issues:

• RadioButton preselection in xaml with multiple RadioButtonGroups not working (#6227), similarity score: 0.81
• RadioButton initialisation makes multiple groups unusable (#16724), similarity score: 0.79
• RadioButton example from Xamarin Forms gallery converted to MAUI doesn't work on Android: radio buttons are not selectable (#6093), similarity score: 0.79
• Radio button loses initial 'IsChecked=True' value when another radio button also has 'IsChecked=True' (#11418), similarity score: 0.78

Note: You can give me feedback by thumbs upping or thumbs downing this comment.

[dotnet-policy-service]

Hi @derek-willis. We have added the "s/needs-repro" label to this issue, which indicates that we require steps and sample code to reproduce the issue before we can take further action. Please try to create a minimal sample project/solution or code samples which reproduce the issue, ideally as a GitHub repo that we can clone. See more details about creating repros here: https://github.com/dotnet/maui/blob/main/.github/repro.md

This issue will be closed automatically in 7 days if we do not hear back from you by then - please feel free to re-open it if you come back to this issue after that time.

[dotnet-policy-service]

This issue has been automatically marked as stale because it has been marked as requiring author feedback to reproduce the issue but has not had any activity for 4 days. It will be closed if no further activity occurs within 3 days of this comment. If it is closed, feel free to comment when you are able to provide the additional information and we will re-investigate.