按下按鈕后，動態地將UI元素添加到StackPanel

Question

這是我在這里的第一個問題:)我不是一個專業的程序員，我只有18歲而且我沒有在大學或任何地方學習過，所以如果我說些愚蠢的話，請不要恨我：p

我正在制作（或者更確切地說是......）一個適用於Windows 10 UWP的應用程序，我的一段xaml代碼如下所示：

<Grid Grid.Row="1" Grid.Column="1">
            <Grid.RowDefinitions>
                <RowDefinition Height="12"/>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="12"/>
            </Grid.RowDefinitions>
            <Rectangle Margin="0" Grid.Row="1" Fill="White" RadiusX="7" RadiusY="7"/>

            <Grid Grid.Row="1" Margin="12,6">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>

                <StackPanel>

                        <TextBox x:Name="textProduct" Margin="0,6,6,6" TextWrapping="Wrap"  VerticalAlignment="Top" BorderBrush="#FFCECED2" FontFamily="Segoe UI Light" FontSize="17" PlaceholderText="Produkt..." BorderThickness="1"/>

                </StackPanel>

                <StackPanel Grid.Column="1">
                    <TextBox x:Name="textAdditionalInfo" Margin="6,6,0,6" TextWrapping="Wrap"  VerticalAlignment="Top" BorderBrush="#FFCECED2" FontFamily="Segoe UI Light" FontSize="17" PlaceholderText="Dodatkowe info..." BorderThickness="1"/>
                </StackPanel>

            </Grid>

我的底部還有一個應用欄，帶有添加和刪除按鈕。 我希望每次用戶按下“添加”按鈕時都能向兩個StackPanel動態添加另一行TextBox，並在每次按下“刪除”按鈕時刪除一行。 不幸的是，我不知道如何實現這一目標。 我試圖找到答案，我認為這可以通過使用UserControl完成，但我不知道如何實現這一點。

我希望這不是太復雜，因為我不希望看到像一個人要求其他人為我做我所有的工作......

如果這是一個大問題，那么它甚至不需要支持刪除TextBoxes。

我希望你明白我的意思。 我不是英國人，對任何錯誤都很抱歉;）

Answer 1

歡迎來到XAML，值得花時間學習它！

為了顯示數據，XAML有一些聰明的東西叫做DataBinding。 一般概念是將List（例如，您希望在StackPanel顯示的所有strings綁定到視圖中的元素。 現在，無論何時修改該列表，視圖都會自動適應。 StackPanel不支持Binding，但是例如ListView （如下所示）

你怎么看這個關於數據綁定的基本信息： https ： //blogs.msdn.microsoft.com/jerrynixon/2012/10/12/xaml-binding-basics-101/

考慮到這一點，你可以做這樣的事情：

<!-- insert at the top -->
<Page.Resources>
    <DataTemplate x:Name="MyDataTemplate">
        <TextBlock Text="{Binding } />
    </DataTemplate>
</Page.Resources>

<!-- insert where you want the list to appear -->
<ListView x:Name="ListView" ItemTemplate="{StaticResource MyDataTemplate}" ItemsSource="{Binding MyCollection}" />

唯一困難的部分是將列表綁定到ListView ，但我相信你可以使用上面的教程來做到這一點;）

另外，您可以使用x:Key="MyStack"命名StackPanel ，並手動添加項目：

MyStack.Children.Add(new TextBlock() {Text = "myText"});

但是，我真的可以建議您使用DataBinding方法，因為它使得在大型項目中與UI的交互變得更加容易。