在 ItemSelected - ListView - Xamarin Forms 上添加复选标记图像答案

【问题标题】：Add checkmark image on ItemSelected - ListView - Xamarin Forms在 ItemSelected - ListView - Xamarin Forms 上添加复选标记图像
【发布时间】：2020-02-10 19:21:26
【问题描述】：

我想在选择项目时添加复选标记图像。见下文

我尝试强制 IsChecked 为 true ，只是为了查看 img 。但似乎没有任何效果

xml

                <ListView x:Name="EmployeeView" ItemSelected="EmployeeView_ItemTapped"
            ItemsSource="{Binding Employees}">
    <ListView.ItemTemplate>
      <DataTemplate>
           <ViewCell>
          <StackLayout>
       <Image Source="calendar" IsVisible="{Binding IsChecked}"/>
       <Label Text="{Binding name}" />

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

 ObservableCollection<Employee> employees = new ObservableCollection<Employee>();
 public ObservableCollection<Employee> Employees { get { return employees; } }

EmployeeView.ItemsSource = employees;

            // ObservableCollection allows items to be added after ItemsSource
            // is set and the UI will react to changes
            employees.Add(new Employee { name = "Rob Finnerty" });
            employees.Add(new Employee { name = "Bill Wrestler" });
            employees.Add(new Employee { name = "Dr. Geri-Beth Hooper" });
            employees.Add(new Employee { name = "Dr. Keith Joyce-Purdy" });
            employees.Add(new Employee { name = "Sheri Spruce" });
            employees.Add(new Employee { name = "Burt Indybrick" , IsChecked=true });




void EmployeeView_ItemTapped(object sender, Xamarin.Forms.SelectedItemChangedEventArgs e)
        {
            if (e.SelectedItem != null)
            {
                var index = (Employee)e.SelectedItem;
                index.IsChecked = true;
            }

【问题讨论】：

为什么不直接将 Image 的 IsVisible 绑定到 IsChecked？触发器似乎没有必要。

标签： listview xamarin.forms expandablelistview listviewitem

【解决方案1】：

如果每个图像都相同，只需硬编码源代码而不是绑定它。相反，绑定IsVisible 属性

<Image Source="checkmark.png" IsVisible="{Binding IsChecked}" x:Name="tickimage">

然后在处理程序中（确保您的模型实现INotifyPropertyChanged）

void Handle_ItemSelected(object sender, Xamarin.Forms.SelectedItemChangedEventArgs e){

  if (e.SelectedItem != null)
  {
    var index = (ImagesModel)e.SelectedItem;
    index.IsChecked = true;
  }
}

【讨论】：

但是这张图片必须在列表之外？
我不知道那是什么意思。
我试过你的方法，但没有运气。可见的没有被触发。
您确定来源正确吗？没有扩展名的“日历”看起来不正确。
是的，您可以在有或没有扩展名的情况下使用它。它出现在这里 employees.Add(new Employee { name = "Burt Indybrick" , IsChecked=true });但不在所选项目上

【解决方案2】：

您的Employee 类是否实现了INotifyPropertyChanged 之类的：

public class Employee: INotifyPropertyChanged
{
    public string name { get; set; }
    public bool isChecked;

    public bool IsChecked
    {
        set
        {
            if (isChecked != value)
            {
                isChecked = value;
                OnPropertyChanged("IsChecked");

            }
        }
        get
        {
            return isChecked;
        }
    }

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

【讨论】：

感谢 notify 属性没有被调用的错误。非常感谢您的两个回答对我有很大帮助。

【解决方案3】：

请添加触发器以根据真假值更改图像像这样

<Image
                                    x:Name="starImage"
                                    Aspect="AspectFit"
                                    HeightRequest="24"
                                    HorizontalOptions="End">
                                    <Image.GestureRecognizers>
                                        <TapGestureRecognizer Tapped="NotificationStarred" />
                                    </Image.GestureRecognizers>
                                    <Image.Triggers>
                                        <DataTrigger
                                            Binding="{Binding Path=IsImportant}"
                                            TargetType="Image"
                                            Value="True">
                                            <Setter Property="Source" Value="StarSelected.png" />
                                        </DataTrigger>

                                        <DataTrigger
                                            Binding="{Binding Path=IsImportant}"
                                            TargetType="Image"
                                            Value="False">
                                            <Setter Property="Source" Value="StarUnselected.png" />
                                        </DataTrigger>
                                    </Image.Triggers>
                                </Image>

【讨论】：