wpf - 如何通过单击按钮将列表框中的项目添加到列表而不需要任何代码隐藏？

Question

我对 MVVM 很陌生，对 WPF 也很陌生。事实上，我几个月前才开始编程。 MVVM 确实让我对绑定(bind)概念着迷，我已经尝试了好几天了，只是简单地制作一个应用程序，允许您从 listbx 中选择一个项目，当您单击“添加”按钮时，所选项目应该是保存在新列表中。第二个列表框显示最新添加的项目，您可以使用另一个按钮选择一个项目并将其删除。通常我会选择点击事件并用相当少的方法装饰我的代码隐藏，但我真的想学习如何通过使用绑定(bind)而不是代码隐藏来完成所有这一切。我将非常高兴获得任何帮助，请记住我对此很陌生，我真的想让它尽可能简单:)亲切的问候丹妮拉

<WrapPanel HorizontalAlignment="Center" Margin=" 10">
   <ListBox x:Name="Firstbox" 
            Width="100"
            ItemsSource="{Binding FoodList}"
            DisplayMemberPath="Name" >
   </ListBox>
   <Button Margin="10 >Select</Button>
   <ListBox Width="100"></ListBox>

私有(private)列表_foodList；

    public List<FoodItem> FoodList
    {
        get { return _foodList; }
        set { _foodList = value; }
    }

    private List<FoodItem> _newFoodList;

    public List<FoodItem> NewFoodList
    {
        get { return _newFoodList; }
        set { _newFoodList = value; }
    }

    public MainViewModel()
    {
        InitializeCommands();
        GetFood();
    }
    private void GetFood()
    {
        FoodList = new List<FoodItem>()
        {
            new FoodItem() {Name="Applepie"}, 
            new FoodItem() {Name="Scones"}
        };
    }

Answer 1

• 首先，您需要将 List 替换为 ObservableCollection，以便 UI 可以检测何时添加新项目。

• 将 SelectedItem 属性添加到您的 ViewModel:

  private FoodItem _selectedItem;
  public FoodItem SelectedItem
  {
      get { return _selectedItem;}
      set
      {
          _selectedItem = value;
          OnPropertyChanged("SelectedItem");
      }
  }
  

• 将第一个 ListBox 的 SelectedItem 属性绑定(bind)到此属性:

  <ListBox Width=" 100" x:Name="Firstbox"
           ItemsSource="{Binding FoodList}"
           DisplayMemberPath="Name"
           SelectedItem="{Binding SelectedItem}" />
  

• 将第二个 ListBox 绑定(bind)到 NewFoodList 属性

• 在 ViewModel 中创建命令:

  private DelegateCommand _addItemCommand;
  public ICommand AddItemCommand
  {
      get
      {
          if (_addItemCommand == null)
          {
              _addItemCommand = new DelegateCommand(AddItem);
          }
          return _addItemCommand;
      }
  }
  
  void AddItem()
  {
      if (SelectedItem != null)
          NewFoodList.Add(SelectedItem);
  }
  

• 最后，将按钮的 Command 属性绑定(bind)到 AddItemCommand 属性:

  <Button Margin="10" Command="{Binding AddItemCommand}" >Select</Button>