How to implement template control for dynamically add controls in wpf?

Question

I have page with some control like picture. i want to add these control dynamically and when user click add those control add dynamically. how can i implement this? i want to use template control or something like this.

Answer 1

According to me using Implicit Data Templates is much easier then anything else User Control also a Good Choice but Data Templates OR Implicit Data Templates are much better.

Take a Look Data Templates

Answer 2

Why don't you take "sample label, persian translate label, textboxes and add voice button" and put them in a usercontrol (Let's give it the name MyUserControl)

then instead of adding that user control directly on the grid of your window, add a stack panel (lets name it MyStackPanel), and add that user control into the stack panel (stack panel must have the orientation set to vertical)

---

Now when the user clicks on the "Plus" button your code will be:

MyStackPanel.Children.Add(new MyUserControl() { Margin = new Thickness(0, 5, 0, 0) });

This will give you the same controls you asked for with a margin top = 5.

---

You will only write code once for the user control, and all the added controls (after clicking on the plus button) will have the same code.

Edit: If you want to delete MyUserControl when clicking the delete button add the following code for for the StackPanel (MyStackPanel) on the main window (look for ButtonBase.Click):

<StackPanel Height="236" HorizontalAlignment="Left" ButtonBase.Click="stackPanel1_Click" Name="stackPanel1" VerticalAlignment="Top" Width="491">

and for the event of the StackPanel:

 private void stackPanel1_Click(object sender, RoutedEventArgs e)
    {
        if (((UserControl1)e.Source).Tag.ToString() == "1")
        {
            stackPanel1.Children.Remove(((UserControl1)e.Source));
        }
        else
        {
            MessageBox.Show("Another button was clicked");
        }

    }

Now the delete button on the user control must have the following line of code:

 this.Tag = 1;