MAUI中按钮点击向Picker添加项失效问题求助

问题原因 #

直接调用pickAnimal.Items.Add()添加选项时，Picker.Items是普通的List<string>，它没有实现INotifyCollectionChanged接口，无法在集合变化时通知UI更新。而在构造函数中设置时，控件正处于初始化渲染阶段，此时的集合修改会被UI渲染流程捕获，所以能正常显示。

解决方法 #

• 在页面类中声明一个可观察集合：

  public ObservableCollection<string> AnimalItems { get; set; } = new ObservableCollection<string>();
  

• 在XAML中给Picker绑定ItemsSource：

  <Picker x:Name="pickAnimal" ItemsSource="{Binding AnimalItems}" />
  

• 在页面构造函数中设置绑定上下文（如果没设置的话）：

  public MainPage()
  {
      InitializeComponent();
      BindingContext = this;
  }
  

• 修改按钮点击事件代码，操作可观察集合：

  private void OnCounterClicked(object sender, EventArgs e)
  {
      AnimalItems.Add("Monkey");
      AnimalItems.Add("Horse");
      pickAnimal.SelectedIndex = 0;
  }
  

改用ObservableCollection<string>后，集合的任何变化都会自动通知UI刷新，点击按钮后Picker就能正常显示新增的选项了。

内容的提问来源于stack exchange，提问作者Extreme_Tough