WPF MVVM 模型中的按钮命令

Question

我的 MainWindow 中有两个 UserControls，UserControl2 有 2 个 Listboxes、Texboxes 和 Buttons。当我在 TextBox 中写入一些文本并按下 Button 时，它应该添加到 ListBox 中。有人可以帮我编写代码吗，我是 WPF 和 MVVM 的新手

这是我的 XAML 代码

<Window x:Class="Wpf_MVVM.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:Wpf_MVVM" 
    Title="Voxer" Background="SlateGray" Height="420" Width="550">


<Grid>
    <local:UserControl1 HorizontalAlignment="Left" VerticalAlignment="Top"/>
    <local:UserControl2 HorizontalAlignment="Left" VerticalAlignment="Top" Margin="150,29,0,0"/>




</Grid>

这是我的 UserControl1.Xaml 代码

<UserControl x:Class="Wpf_MVVM.UserControl1"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         Height="Auto" Width="Auto">
<Grid>
    <ListBox HorizontalAlignment="Left" Height="310" VerticalAlignment="Top" Width="150" Margin="0,40,0,0">
        <ListBoxItem>Name 1</ListBoxItem>
        <ListBoxItem>Name 2</ListBoxItem>
        <ListBoxItem>Name 3</ListBoxItem>
        <ListBoxItem>Name 4</ListBoxItem>
        <ListBoxItem>Name 5</ListBoxItem>
        <ListBoxItem>Name 6</ListBoxItem>
    </ListBox>
    <Label Content="Conversations" HorizontalAlignment="Left" VerticalAlignment="Top"  Height="40" Width="150" FontSize="20" Background="SkyBlue"/>
    <Button Content="Create New Chat" Height="30" HorizontalAlignment="Left" Margin="0,350,0,0" VerticalAlignment="Top" Width="150"/>

</Grid>

这是我的 UserControl2.Xaml 代码

<UserControl x:Class="Wpf_MVVM.UserControl2"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         Height="Auto" Width="390">
<Grid>
    <ListBox Name="listbox1" HorizontalAlignment="Left" Height="310" VerticalAlignment="Top" Width="180" Margin="10,0,0,0"/>
    <ListBox Name="listbox2"  HorizontalAlignment="Left" Height="310" Margin="200,0,0,0" VerticalAlignment="Top" Width="180"/>
    <TextBox Name="tb1" HorizontalAlignment="Left" Height="40" Margin="200,310,0,0" TextWrapping="NoWrap" Text="" VerticalAlignment="Top" Width="130"/>
    <TextBox Name="tb2" Height="40" TextWrapping="NoWrap" Text="" Margin="10,310,245,0"/>
    <Button Command="{Binding ButtonCommand}" Name="btn1" Content="Send" Height="40" HorizontalAlignment="Left" Margin="330,310,0,0" VerticalAlignment="Top" Width="50" />
    <Button Command="{Binding SendControlCommand}" Name="btn2" Content="Send" Height="40" Margin="145,310,200,0"/>

</Grid>

Answer 1

听起来你是在黑暗中刺伤......你说你正在使用 MVVM 和 WPF，但我认为你应该首先修改你对这些主题的背景......

基本上，您的视图应该绑定到 ViewModel 上的属性。

通常你会想要一个可观察的集合作为列表框的来源，并且在你的 XAML 上做一些类似的事情

<ListBox Name="listbox_name"  ... ItemSource="{Binding ListPropertyName}/>

（我假设您有一个名为ListPropertyName ObservableCollection类型的属性，显然您会根据需要将其命名为其他名称）

然后，命令。 一旦你有：

<Button Command="{Binding ButtonCommand}" Name="btn1" Content="Send"... />

这意味着您需要在视图模型代码中有一个 ICommand 属性，称为ButtonCommand ：

public ICommand ButtonCommand{ get; private set; }

在你的构造函数中，你可以这样写：

ButtonCommand= new RelayCommand<object>(Execute_YourMethodHere);

现在，当您点击按钮时，您的Execute_YourMethodHere就会运行。

这是您可能希望将对象添加到 ObservableCollection 的地方（假设您使用了 INotifyPropertyChanged，因此视图将知道您的集合已更改），这就是真正的问题......

Answer 2

你忘记了DataContext吗？ 在后面的代码中，您应该添加这一行： this.DataContext = new YourViewModel();

你能展示你的命令方法吗？

Answer 3

您忘记了将 ItemsSource 绑定到第二个 xaml 中的列表。 如果你想用 MVVM 以正确的方式做到这一点，你需要视图模型中的两个 ItemsSource 属性、两个中继命令和两个字符串属性。 在命令操作中，只需将适当的文本添加到适当列表的 ItemsSource。

您还需要了解 INotifyPropertyChanged、ObservableCollection 和 ICommand 以使其工作。