如何在MVVM中为复选框添加代码？

问题描述

我有一个用于复选框的代码。请告诉我如何在MVVM中编写它？ 有一个功能，我只能选择一个复选框。一般来说，我知道我必须编写命令。

XAML：

    <StackLayout>
            <!-- Place new controls here -->
            <ListView ItemsSource="{Binding Items}" ItemSelected="ListView_ItemSelected">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <StackLayout Orientation="Horizontal">
                                <CheckBox HorizontalOptions="Start" Color="Black" CheckedChanged="CheckBox_CheckedChanged"
                                        IsChecked="{Binding IsSelected}"
                                        />
                                <Label Text="meow" TextColor="Gray"></Label>
                            </StackLayout>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </StackLayout>

代码隐藏

     public partial class MainPage : ContentPage
        {
            public MainPage()
            {
                InitializeComponent();
    
                BindingContext = new MainPageviewmodel();
            }
    
            Model prevIoUsModel;
            private void CheckBox_CheckedChanged(object sender,CheckedChangedEventArgs e)
            {
                if (prevIoUsModel != null)
                {
                    prevIoUsModel.IsSelected = false;
                }
                Model currentModel = ((CheckBox)sender).BindingContext as Model;
                prevIoUsModel = currentModel;
    
                if (currentModel.IsSelected)
                {
                    var viewmodel = BindingContext as MainPageviewmodel;
                    int index = viewmodel.Items.IndexOf(currentModel);
                }
                
            }
    
            private void ListView_ItemSelected(object sender,selecteditemchangedEventArgs e)
            {
                if (prevIoUsModel != null)
                {
                    prevIoUsModel.IsSelected = false;
                }
                Model currentModel = e.SelectedItem as Model;
                currentModel.IsSelected = true;
                prevIoUsModel = currentModel;
            }
        }

viewmodel

        public class MainPageviewmodel
        {
            public List<Model> Items { set; get; }
            public MainPageviewmodel()
            {
                List<Model> list = new List<Model>();
                for (int i=0; i<10; i++)
                {
                    list.Add(new Model { IsSelected = false });
                }
                Items = list;
            }
        }

型号

        public class Model : INotifyPropertyChanged
        {
            bool isSelected;
            public bool IsSelected
            {
                set
                {
                    isSelected = value;
                    onPropertyChanged();
                }
                get => isSelected;
            }
    
            public event PropertyChangedEventHandler PropertyChanged;
            void onPropertyChanged([CallerMemberName] string propertyName = null)
            {
                PropertyChanged?.Invoke(this,new PropertyChangedEventArgs(propertyName));
            }
        }

解决方法

要发出命令的事件，请使用Corcav.Behavior nuget https://github.com/corradocavalli/Corcav.Behaviors

...
xmlns:corcav="clr-namespace:Corcav.Behaviors;assembly=Corcav.Behaviors"
...

<CheckBox>
         <corcav:Interaction.Behaviors>
                 <corcav:BehaviorCollection>
                        <corcav:EventToCommand EventName="CheckedChanged" Command="{Binding Path=CheckBoxChangedCommand}" Commandparameter="{Binding .}"/>
                 </corcav:BehaviorCollection>
          </corcav:Interaction.Behaviors>
</CheckBox>

在ViewModel中添加此命令并编写逻辑

public ICommand CheckBoxChangedCommand{ get; set; }
...
CheckBoxChangedCommand= new Command<object>(CheckBoxChanged);
...
private void CheckBoxChanged(object obj)
        {
    //set all list/collection element to false with linq
            if(obj is Model model)
            {
                model.IsSelected = true;
            }
        }

,

目前，CheckBox不支持Command。此问题已在Github上报告，但尚未解决。我们可以遵循此增强功能。 https://github.com/xamarin/Xamarin.Forms/issues/6606

您可以改用InputKit。在NuGet上安装Xamarin.Forms.InputKit。 它提供了CheckChangedCommand。

CheckChangedCommand ：（命令）可绑定命令，当更改检查时执行。

 <input:CheckBox  HorizontalOptions="Start" Color="Black" CheckChangedCommand="{Binding CheckBoxChangedCommand}">