Xamarin Forms Switch inside Stacklayout BindableLayout get toggled event using MVVM (Prism.Forms)

Question

I have the following list:

 <StackLayout BindableLayout.ItemsSource="{Binding NotificationList}" Margin="0,10,0,10" >
                     <BindableLayout.ItemTemplate>
                         <DataTemplate>                             <StackLayout Style="{StaticResource StacklayoutAStyle}">
                                <Label Text="{Binding notificationLabel}" VerticalOptions="Center" VerticalTextAlignment="Center"/>
                                 <Switch IsToggled="{Binding isNotificationToggled, Mode=TwoWay}" VerticalOptions="Center" HorizontalOptions="End" />
                             </StackLayout>
                         </DataTemplate>
                     </BindableLayout.ItemTemplate>
                 </StackLayout>

I'd like to get the notificationLabel text when I toggle the corresponding switch in the list. My ViewModel looks like this:

 private ObservableCollection<NotificationModel> _notificationList = new ObservableCollection<NotificationModel>
         {
             new NotificationModel { notificationLabel = "Notification1", isNotificationToggled = true },
             new NotificationModel { notificationLabel = "Notification2", isNotificationToggled = false },
             new NotificationModel { notificationLabel = "Notification3", isNotificationToggled = false },
             new NotificationModel { notificationLabel = "Notification4", isNotificationToggled = true },
         };
         public ObservableCollection<NotificationModel> NotificationList
         {
             get { return _notificationList; }
             set { SetProperty(ref _notificationList, value); }
         }

When I toggled Notification 3 for example, it switches to on (true), but how can I capture that event with "Notification 3"?

Answer 1

You can use Switch.Toggled to listen for toggled event,then get the BindingContext (NotificationModel),then determine which Switch is turned on according to NotificationModel.notificationLabel.

<StackLayout BindableLayout.ItemsSource="{Binding NotificationList}" Margin="0,10,0,10" >
        <BindableLayout.ItemTemplate>
             <DataTemplate>                             
                 <StackLayout Style="{StaticResource StacklayoutAStyle}">
                       <Label Text="{Binding notificationLabel}" VerticalOptions="Center" VerticalTextAlignment="Center"/>
                       <Switch IsToggled="{Binding isNotificationToggled, Mode=TwoWay}" VerticalOptions="Center" HorizontalOptions="End" Toggled="Switch_Toggled" />
                 </StackLayout>
             </DataTemplate>
        </BindableLayout.ItemTemplate>
</StackLayout>

in your page.xaml.cs:

private void Switch_Toggled(object sender, ToggledEventArgs e)
    {
        Switch sw = sender as Switch;
        NotificationModel notificationModel = (NotificationModel)sw.BindingContext;
        if (e.Value)
        {
            switch (notificationModel.notificationLabel)
            {
                case "Notification1":
                    //do something
                    break;

                case "Notification2":
                    //do something
                    break;
                case "Notification3":
                    //do something
                    break;
                case "Notification4":
                    //do something
                    break;
            }
        }
    }