How to select only one Toggle Switch in Listview?

Issue

I have a Listview which has toggle switches. I want to select only one item in Listview with toggle switch. When I select second toggle then first toggle must be de-active again. For example in the picture; When I select Rekorida and then I select Merchandizing , Rekorida must turn back disable. Every time only one option can be active. Is it possible to do it in Xamarin?

Example listview

My listView Code :

 <ScrollView>
                    <ListView x:Name"ShipListView" HasUnevenRows"True" SeparatorVisibility"Default" SelectionMode"Single">
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <ViewCell>

                                    <Grid Margin"4, 3, 4, 3" Padding"2" BackgroundColor"White">
                                        <Grid.RowDefinitions HeightRequest"40">
                                            <RowDefinition></RowDefinition>
                                            <!--<RowDefinition Height"20"></RowDefinition>-->
                                        </Grid.RowDefinitions>
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width"80*"></ColumnDefinition>
                                            <ColumnDefinition Width"*"></ColumnDefinition>
                                            <ColumnDefinition Width"40*"></ColumnDefinition>
                                        </Grid.ColumnDefinitions>
                                        <Label Text"{Binding ShipName}" TextColor"DeepPink" Grid.Column"0" FontAttributes"Bold"/>
                                        <Switch  IsToggled"{Binding Selected}" Grid.Column"2" Toggled"OnShipToggled" />
                                    </Grid>

                                </ViewCell>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                    </ListView>
                </ScrollView>

And My function

async void OnShipToggled(object sender, ToggledEventArgs e)
    {

        checkShipSelected  !checkShipSelected;
        if(checkShipSelected)
        {

            ViewCell cell  (sender as Switch).Parent.Parent as ViewCell;

            ParametersMemberShipInformation model  cell.BindingContext as ParametersMemberShipInformation;

            if (model ! null)
            {
                selectedMemberShipOid  model.Oid;
            }
        }
        else
        {
            return;
        }


    }

I’m trying get id of selected item in listview and I do this successfully. Bu I want users can only select one item at the same time because of nice visuality and not be confused.

Solution

Fetch your view model in your code behind file and then filter out the selected toggle and marked rest of them as false

private YourViewModel MyViewModel { get > BindingContext as YourViewModel; }

if (model ! null)
{
 selectedMemberShipOid  model.Oid;
 MyViewModel.ShipListView.Where(x> x.Oid ! 
     selectedMemberShipOid).Foreach(x> x.Selected  false)

}

Answered By – Hammad Shabbir

Leave a Comment