在 collectionview xamarin 中计算选中的复选框

Count selected checkboxes in collectionview xamarin

我有一个带有复选框的集合视图。我想计算已选中的复选框的数量,并在标签(字符串 Sel)中显示该值。我想我基本上已经完成了,但是标签没有更新。我认为这是由于没有在正确的地方调用 OnProperty changed 来更新标签。我仍在思考 MVVM。谢谢

模型视图:

public class MeetAWalkerViewModel : INotifyPropertyChanged
 {
       
       
     public ObservableCollection<PetProfile> source;
     public ObservableCollection<PetProfile> PetInfo { get; private set; }
     public ObservableCollection<PetProfile> EmptyPetInfo
     {
         get => source;
         private set
         {
             if (value != source)
             {
                 source = value;
                 OnPropertyChanged(nameof(EmptyPetInfo));
             }
         }
     }
     
        
     public string Sel { get; private set; }

     public MeetAWalkerViewModel()
     {
            
         var count = EmptyPetInfo.Count(t => t.Selected);
         Sel = "Amount of selected pets" + Convert.ToString(count);
     }

       
        
     #region INotifyPropertyChanged
     public event PropertyChangedEventHandler PropertyChanged;
     void OnPropertyChanged([CallerMemberName] string propertyName = null)
     {
         PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
     }
     #endregion
 }

Xaml:

<CollectionView  x:Name="petCollectionView"  ItemsSource="{Binding EmptyPetInfo}">
                 <CollectionView.ItemTemplate>
                     <DataTemplate>
                         <Grid Padding="10" RowDefinitions="80" ColumnDefinitions="120,60,60">
                             <Image Grid.Column="0"
                                Grid.Row="0"
                                x:Name="PetImage"
                                Source="{Binding imageUrl}"/>
                             <Label Grid.Column="1"
                                Grid.Row="0"
                                Text="{Binding PetName}"
                                FontAttributes="Bold"
                                x:Name="labelpetname" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"/>
                             <CheckBox  Grid.Row="0" Grid.Column="2" HorizontalOptions="End" IsChecked="{Binding Selected, Mode=TwoWay}" CheckedChanged="CheckBox_CheckedChanged" BindingContext="{Binding .}"/>
                         </Grid>
                     </DataTemplate>
                 </CollectionView.ItemTemplate>
             </CollectionView>

您需要像这样更改字符串

String sel ;
        public String Sel 
        {
            set
            {
                if (sel != value)
                {
                    sel = value;
                    OnPropertyChanged(nameof(Sel ));
                }
            }
            get
            {
                return sel ;
            }
        }

我根据你的代码制作了一个示例,它可以正常工作。

您可以参考以下代码:

MeetAWalkerViewModel.cs

 public class MeetAWalkerViewModel: INotifyPropertyChanged
{
    public ObservableCollection<PetProfile> source;
    //public ObservableCollection<PetProfile> PetInfo { get; private set; }
    public ObservableCollection<PetProfile> EmptyPetInfo
    {
        get => source;
        private set
        {
            if (value != source)
            {
                source = value;
                OnPropertyChanged(nameof(EmptyPetInfo));
            }
        }
    }

    int _count;
    public int Count
    {
        set
        {
            if (_count != value)
            {
                _count = value;
                OnPropertyChanged(nameof(Count));

                Sel = "Amount of selected pets is : " + Convert.ToString(_count);
            }
        }
        get
        {
            return _count;
        }
    }

    public void updateCount(int count) { 
    
    }

    String sel;
    public String Sel
    {
        set
        {
            if (sel != value)
            {
                sel = value;
                OnPropertyChanged(nameof(Sel));
            }
        }
        get
        {
            return sel;
        }
    }

    public MeetAWalkerViewModel()
    {
        EmptyPetInfo = new ObservableCollection<PetProfile>();
        EmptyPetInfo.Add(new PetProfile { PetName = "Pet1", IsSelected= false,ImageUrl= "cherry.png" });
        EmptyPetInfo.Add(new PetProfile { PetName = "Pet2", IsSelected = false, ImageUrl = "watermelon.png" });
        EmptyPetInfo.Add(new PetProfile { PetName = "Pet3", IsSelected = false, ImageUrl = "cherry.png" });
        EmptyPetInfo.Add(new PetProfile { PetName = "Pet4", IsSelected = false, ImageUrl = "watermelon.png" });
        EmptyPetInfo.Add(new PetProfile { PetName = "Pet5", IsSelected = false, ImageUrl = "cherry.png" });
        EmptyPetInfo.Add(new PetProfile { PetName = "Pet6", IsSelected = false, ImageUrl = "watermelon.png" });

        foreach (PetProfile petProfile in EmptyPetInfo) {
            if (petProfile.IsSelected)
            {
                Count++;
            }

        }
        Sel = "Amount of selected pets is : " + Convert.ToString(Count);
    }

    #region INotifyPropertyChanged
    public event PropertyChangedEventHandler PropertyChanged;
    void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
    #endregion
}

MainPage.xaml

<StackLayout HorizontalOptions="Center"  Padding="10" >
    <Label   x:Name="countSelectedItemsLabel" Text="{Binding Sel}" FontSize="20" />

    <CollectionView  x:Name="petCollectionView"  ItemsSource="{Binding EmptyPetInfo}">
        <CollectionView.ItemTemplate>
            <DataTemplate>
                <Grid Padding="10" RowDefinitions="80" ColumnDefinitions="120,60,60">
                    <Image Grid.Column="0"
                            Grid.Row="0"
                            x:Name="PetImage"
                            Source="{Binding ImageUrl}"/>
                    <Label Grid.Column="1"
                            Grid.Row="0"
                            Text="{Binding PetName}"
                            FontAttributes="Bold"
                            x:Name="labelpetname" VerticalTextAlignment="Center" HorizontalTextAlignment="Center"/>
                    <CheckBox  Grid.Row="0" Grid.Column="2" HorizontalOptions="End" IsChecked="{Binding IsSelected, Mode=TwoWay}" CheckedChanged="CheckBox_CheckedChanged" BindingContext="{Binding .}"/>
                </Grid>
            </DataTemplate>
        </CollectionView.ItemTemplate>
    </CollectionView>
</StackLayout>

MainPage.xaml.cs

public partial class MainPage : ContentPage
    {

        MeetAWalkerViewModel viewModel;

        int selectedCount = 0;

        public MainPage()
        {
            InitializeComponent();

            viewModel = new MeetAWalkerViewModel();
            BindingContext = viewModel;
        }

        private void CheckBox_CheckedChanged(object sender, CheckedChangedEventArgs e)
        {
            PetProfile model = (PetProfile)((CheckBox)sender).BindingContext;

            if (model.IsSelected)
            {
                selectedCount++;
            }
            else
            {
                selectedCount--;
            }

            viewModel.Count = selectedCount;

        }
    }

PetProfile.cs

public class PetProfile
{
    public string PetName { get; set; }

    public string ImageUrl { get; set; }

    public bool IsSelected { get; set; }
}

结果是: