How to mark the checkbox in repeater in Xamarin.Forms?

Question

I am using checkbox control under repeater to do a radio button functionality, everything seems to be fine but now stuck on how to bind the checkbox when the page loads. I have saved the radio button text whichever was selected and once user come back to page again I want to bin what he has selected last time. Not getting any hint here how to proceed.

<grial:Repeater
    x:Name="PP"
    SelectionMode="Single"
    InitialSelection="Empty"     
    ItemSize="100"
    HorizontalOptions="Start"
    ItemsSource="{Binding BlowerPostions}">
    <grial:Repeater.ItemTemplate>
        <DataTemplate>
            <grial:Checkbox
                IsChecked="false"
                UncheckedBorderColor="Black">
                <Label
                    TextColor="Black"
                    Text="{ Binding . }"
                    Margin="8,0" />
            </grial:Checkbox>
        </DataTemplate>
    </grial:Repeater.ItemTemplate>
    <grial:Repeater.SelectedItemTemplate>
        <DataTemplate>
            <grial:Checkbox
                IsChecked="true"
                UncheckedBorderColor="Black"
                InputTransparent="true">
                <Label
                    TextColor="Black"
                    Text="{ Binding . }"
                    Margin="8,0" />
            </grial:Checkbox>
        </DataTemplate>
    </grial:Repeater.SelectedItemTemplate>
</grial:Repeater>

View Model :

public class ProductionViewModel : INotifyPropertyChanged
{
    public ObservableCollection<BlowerPostion> _blowerPostions;

    public ObservableCollection<BlowerPostion> BlowerPostions
    {
        get => _blowerPostions;
        set
        {
            _blowerPostions = value;

            if (PropertyChanged != null)
            {
                PropertyChanged(this, new 
                PropertyChangedEventArgs("BlowerPostions"));
            }
        }
    }

    public void LoadData()
    {
      BlowerPostions = new ObservableCollection<BlowerPostion>();
      BlowerPostions.Add(new BlowerPostion("Left", 1));
      BlowerPostions.Add(new BlowerPostion("Standard", 1));
    }
}

public class BlowerPostion
{
    public string Text { get; set; }
    public int Id { get; set; }

    public BlowerPostion(string _text, int _id)
    {
        Text = _text;
        Id = _id;
    }
}


  

Answer 1

I don't use grial:Repeater,but you can refer to the following code which use CheckBox in ListView item.

Item.cs

public  class Item
{
    public string Name { get; set; }
    public string Type { get; set; }
    public string Image { get; set; }

    //This field indicates whether or not it is selected
    public bool isChecked { get; set; }
}

MyViewModel.cs

public  class MyViewModel
{
    public ObservableCollection<Item> items { get; private set; }

    public MyViewModel() {
        items = new ObservableCollection<Item>();

        items.Add(new Item { Name = "Tomato", Type = "Fruit", Image = "tomato.png", isChecked = true });
        items.Add(new Item { Name = "Romaine Lettuce", Type = "Vegetable", Image = "lettuce.png", isChecked = false });
        items.Add(new Item { Name = "Zucchini", Type = "Vegetable", Image = "zucchini.png", isChecked = false });
    }
}

TestPage1.xaml

<ContentPage.Content>
    <ListView x:Name="listview" ItemsSource="{Binding items}"         VerticalOptions="FillAndExpand">
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <StackLayout Orientation="Horizontal" Padding="5,0,5,0">
                        <Label  Text="{Binding Name}" HorizontalOptions="StartAndExpand" FontSize="30"/>

                        <input:CheckBox    IsChecked="{Binding isChecked}"  Type="Check" Color="White" BoxBackgroundColor="Green" TextColor="White" HeightRequest="40" 
                                         CheckChanged="CheckBox_CheckChanged"  BindingContext="{Binding .}" />

                    </StackLayout>
                </ViewCell>
            </DataTemplate>

        </ListView.ItemTemplate>

    </ListView>
</ContentPage.Content>

TestPage1.xaml.cs

public partial class TestPage1 : ContentPage
{
    public List<Item> selectedItems; // define `selectedItems` as the list of selected items.

    public MyViewModel viewModel;

    public TestPage1 ()
    {
        InitializeComponent ();

        selectedItems = new List<Item>(); // init the `selectedItems`
        viewModel = new MyViewModel();

        BindingContext = viewModel;
    }

    private void CheckBox_CheckChanged(object sender, EventArgs e)
    {
        var checkbox = (Plugin.InputKit.Shared.Controls.CheckBox)sender;
        var ob = checkbox.BindingContext as Item;

        if (ob != null)
        {
            System.Diagnostics.Debug.WriteLine("isChecked = " + ob.isChecked  + "<--->  Name = " + ob.Name +"<--->  Type = " + ob.Type );
            if (ob.isChecked)
            {
                selectedItems.Add(ob);
            }
            else {
                // remove the item
            }
        }
    }
}

Note:

1.add new field isChecked in item model

 public bool isChecked { get; set; }

2.Add event CheckChanged for the item.And when we check the CheckBox,we can get the corresponding value isChecked of the CheckBox.

<input:CheckBox    IsChecked="{Binding isChecked}"  Type="Check" Color="White" BoxBackgroundColor="Green" TextColor="White" HeightRequest="40" 
                                         CheckChanged="CheckBox_CheckChanged"  BindingContext="{Binding .}" />