c# - wpf-单击按钮时动态创建新文本框和文本 block 并将其添加到网格行

Question

我有一个网格布局。每行有三列。第一列包含一个文本框，第二列和第三列包含文本 block 。

我添加了一个新按钮，我想要做的是，每当用户单击该按钮时，它都会生成一个新行，该行在第 1 列包含一个 TextBox，第 2 和第 3 列包含 TextBlock。

我正在做这个 ss 我想获取用户在每个文本框上输入的值(名称)，然后做一些 Web调用服务以检索相关值以在同一行的两个 TextBlocks 上显示。

我已经搜索了几个与此相关的 stackoverflow 线程，但主要建议您通过将新控件(例如文本框)作为子控件添加到网格布局而不是使用 MVVM 来实现事件处理程序 buttonClicked()。

我想知道是否有任何方法可以使用 MVVM 实现此目的？有什么建议吗？

Answer 1

在仔细阅读上面的评论后，@benPearce 指出了对同一问题的出色回答 dynamically add controls .希望下面的一些额外信息仍然会有所帮助。

要动态添加控件，请使用 ItemsControl 或派生对象并绑定(bind)到您要使用的 View 模型的集合。这只是一个真实的基本示例，为简洁起见省略了一些样板:

XAML

<Window x:Class="MyWpfApp.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApplication1"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="3*"/>
        </Grid.RowDefinitions>
        <Button Content="Add New Entry" Command="{Binding AddNewEntryCommand}"/>
        <ItemsControl Grid.Row="1" ItemsSource="{Binding TextEntryItems}">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{Binding Label}"/>
                        <TextBox Text="{Binding Data}"/>
                    </StackPanel>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
    </Grid>
</Window>

C#

namespace MyWpfApp {
    public class MainWindowViewModel : INotifyPropertyChanged {

        private void AddNewEntry() {
            TextEntryItems.Add(new TextEntryViewModel("NewItem"));
        }

        private ObservableCollection<TextEntryViewModel> textEntryItems;
        public ObservableCollection<TextEntryViewModel> TextEntryItems { get { return textEntryItems; } set { textEntryItems = value; FirePropertyChanged(); } }

        public ICommand AddNewEntryCommand { get { new RelayCommand(AddNewEntry)} }
    }

    public class TextEntryViewModel : INotifyPropertyChanged {

        public TextEntryViewModel(string label) {
            Label = label;
        }

        private string label;
        public string Label { get { return label; } set { label = value; FirePropertyChanged(); } }

        private string data;
        public string Data { get { return data; } set { data = value; FirePropertyChanged(); } }        
    }

}