在 UWP 中使用按钮单击以动态和编程方式重复一组控件

Question

我尝试在用户每次单击添加按钮时动态添加控件集，并在用户单击删除按钮时删除。 要重复的控件

以前

单击"添加项目"后

XAML 代码

<StackPanel Name="itemStack" Orientation="Horizontal" VerticalAlignment="Bottom" Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="4">
<AutoSuggestBox Name="itemCategory"
PlaceholderText="Ring"
Header="Item Category" 
Grid.Row="3" 
Grid.Column="0"
HorizontalAlignment="Stretch" 
QueryIcon="List"
Margin="10,10,10,0"
/>
<AutoSuggestBox Name="itemDescription" 
PlaceholderText="3 White Stone Ring" 
Header="Description of the Jewels"                          
Grid.Row="3" 
Grid.Column="1"
Grid.ColumnSpan="2"
HorizontalAlignment="Stretch" 
QueryIcon="List"
Margin="10,10,10,0"
/>
<TextBox Name="qty" 
Text="1" 
Header="Quantity"
Grid.Row="3" 
Grid.Column="4"
HorizontalAlignment="Stretch"
Margin="10,10,10,0"
/>
<StackPanel Orientation="Horizontal" VerticalAlignment="Bottom" Grid.Row="3" Grid.Column="5">
<AppBarButton Name="addItem_button"
Icon="Add"
Label="Add item"                                    
LabelPosition="Default"
VerticalAlignment="Bottom"
Click="addItem_button_Click"
/>
<AppBarButton Name="deleteItem_button"
Icon="Cancel"
Label="Del item"
LabelPosition="Default"      
VerticalAlignment="Bottom"
/>
</StackPanel>
</StackPanel>

我想重复整个堆栈面板，包括应用栏按钮。

Answer 1

使用 MVVM(模型-视图-视图模型(数据绑定与ListView是此方案的理想选择。

您需要做的是创建一个ListView，其中包含StackPanel作为其ItemTemplate。然后，您将需要一个ViewModel类，该类将以TwoWay方式将数据绑定到控件，这将确保控件中选择的值将投影到ViewModel类上。最后，若要创建按钮功能，需要将操作绑定到Command属性。

由于一开始要做很多事情，因此我建议你先查看一些有关 UWP 中数据绑定的简单教程：

• 数据绑定基础知识
• 命令
• x:Bind样品
• 最小的 MVVM 应用

Answer 2

正如@Martin在他的回答中所说，实现你想要的常用方法是使用带有 ItemTemplate 的列表视图。

如果要将其插入网格行中，这意味着您将不得不以编程方式进行大量工作：创建控件，更新网格行并插入控件。还必须监视何时删除控件以更新网格。

如果要这样做，请将 xaml 包装在自定义控件中，以便可以重复使用它。然后在代码隐藏中操作网格的Children属性...你将使用 网格附加属性Grid.SetRow将行分配给控件。

如您所见，它很多