BindableRadioGroup in Xamarin iOS project

Question

I'm working in a Xamarin project. Previously the project was only Android, now I need to include also the iOS version of the same application. In a page of my application there is a dynamic list of radio button. The component that I used is a BindableRadioGroup of the XLabs.Forms package.

This is the tag in the xaml page:

<ScrollView  Orientation = "Vertical" VerticalOptions="Start" HeightRequest="250">  
    <controls:BindableRadioGroup SelectedIndex="{Binding SelectedAnomaly, Mode=TwoWay}" ItemsSource="{Binding AnomalyList, Mode=TwoWay}" />  
</ScrollView>  

The code in my ViewModel:

public DomainFEModel SelectedAnomalyDomain  
        {  
            get { return _selectedAnomalyDomain; }  
            set { SetProperty(ref _selectedAnomalyDomain, value); }  
        }  
  
public ObservableCollection<string> AnomalyList  
        {  
            get { return _anomalyList; }  
            set { SetProperty(ref _anomalyList, value); }  
        }  

This is the front-end model:

public class DomainFEModel : FEModel  
{  
    public string key { get; set; }  
    public string description { get; set; }  
  
}  

The list is dynamically populated from the database. All works correctly in the Android version:

But it doesn't work in the iOS version:

I can't select an element of the list. How I can solve this problem in iOS? There is another way to create this radio button dynamic list that can work both in Android and iOS version?
Thanks!

Answer 1

Hello,

Welcome to Microsoft Q&A!

You can simply use ListView + RadioButton to implement the radio button list .

Xaml

   <ListView ItemsSource="{Binding AnomalyList}" SelectedItem="{Binding SelectedAnomalyDomain}" SeparatorVisibility="None">  
           <ListView.ItemTemplate>  
               <DataTemplate>  
                   <ViewCell>  
                       <RadioButton Content="{Binding .}"/>  
                   </ViewCell>  
               </DataTemplate>  
           </ListView.ItemTemplate>>  
       </ListView>  

Best Regards,
Cole Xia

---

If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Answer 2

Thanks for your help.
I updated the Xamarin version to the last version (5.0.0.2012) and implemented the radiobutton as described above.
I can see correctly the list of items but if I select one of them the variable binded as "SelectedItem" is always null.
Where is my mistake?

Xaml:

<ScrollView  Orientation = "Vertical" VerticalOptions="Start" HeightRequest="250">
                <ListView ItemsSource="{Binding Anomalies, Mode=TwoWay}" SelectedItem="{Binding SelectedAnomalyRB, Mode=TwoWay}" SeparatorVisibility="None" BackgroundColor="White">

                <ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <RadioButton Content="{Binding description}" Value="{Binding key}" GroupName="Anomalies" BackgroundColor="White" TextColor="Black" />
                            </ViewCell>
                        </DataTemplate>
                </ListView.ItemTemplate>
                </ListView>                    
            </ScrollView>

ViewModel:

private DomainFEModel[] _anomalies;
private string _selectedAnomalyRB;

public DomainFEModel[] Anomalies
        {
            get { return _anomalies; }
            set { SetProperty(ref _anomalies, value); }
        }

public string SelectedAnomalyRB
        {
            get { return _selectedAnomalyRB; }
            set
            {
                SetProperty(ref _selectedAnomalyRB, value);                
            }
        }

Thank you!

Answer 3

SelectedItem doesn't work for me.
This is my workaround:

XAML:

<ScrollView  Orientation = "Vertical" VerticalOptions="Start" HeightRequest="300">
                <ListView ItemsSource="{Binding Anomalies}" SelectionMode="Single" SeparatorVisibility="None" BackgroundColor="White">
                    <ListView.ItemTemplate>
                        <DataTemplate>
                            <ViewCell>
                                <RadioButton Content="{Binding description}" Value="{Binding key}" IsChecked="{Binding selected}" GroupName="Anomalies" BackgroundColor="White" TextColor="Black" />
                            </ViewCell>
                        </DataTemplate>
                    </ListView.ItemTemplate>
                </ListView>
            </ScrollView>

ViewModel:

private DomainFEModel[] _anomalies;

public DomainFEModel[] Anomalies
    {
        get { return _anomalies; }
        set { SetProperty(ref _anomalies, value); }
    }

DomainFEModel class:

public class DomainFEModel : FEModel
    {
        public string key { get; set; }
        public string description { get; set; }    
        public bool selected { get; set; } = false;

    }

When I need I call this method to retrieve the selected element:

private DomainFEModel getSelectedAnomaly()
        {
            try
            {
                for (int i = 0; i < Anomalies.Length; i++)
                {
                    if (Anomalies[i].selected)
                    {
                        return Anomalies[i];
                    }
                }
                return null;
            }
            catch (Exception e)
            {                
                return null;
            }
        }