How to add entry fields dynamically during run time in Xamarin.Forms

Question

I am developing a project using Xamarin.Forms, where I need to create entry fields dynamically during run-time.

For example, the user would be asked for the number of players playing in a team and based on the data provided by the user I need to create Entry fields such as name, age, contact, etc. for each player.

Answer 1

But how would this help me in adding the entry fields dynamically i.e. based on the number of players entered by the user?

First of all, you can either create them dynamically through C# or add them and hide them in Xaml. In case of Xaml way, what you can do is add the entries and set their visibily to false, you don't really need to create x numbers of entries, you just want to collect the data depending on the number of players.
So first of all, just add one entry for each field you want:

<Entry x:Name="NameEntry" IsVisible="false" />
<Entry x:Name="AgeEntry" IsVisible="false" />

Now, after the user provides his number of players, first of all you turn the entries to be visible in your xaml.cs:

NameEntry.IsVisible = true;
AgeEntry.IsVisible = true;

You can store your number of players in a variable, and I guess you will have a button to save data right? After each click on that button, you check if the number of saved data has reached the number of players and clear the entries, and once reached you turn them back to be invisible:

NameEntry.Text = string.Empty;
AgeEntry.Text = string.Empty;
numberOfSavedData++;
//your saving logic in your button click
if (numberOfSavedData == numberOfPlayers) 
{
    NameEntry.IsVisible = false;
    AgeEntry.IsVisible = false;
    //etc...
}

That's not really dynamically creating them, this is just to hide/show the entries. Now if you want to create them and then delete them later on, you can do it in your xaml.cs as well. Suggestion would be creating a stack layout in your xaml to add the entries to it.

<StackLayout x:Name="EntriesStackLayout">
</StackLayout>

In your xaml.cs, after the number of players has been provided, you add just 1 entry of what data you need, like:

Entry nameEntry = new Entry();
Entry ageEntry = new Entry();
EntriesStackLayout.Children.Add(nameEntry);
EntriesStackLayout.Children.Add(ageEntry);

And as stated before, you would of course have a button to save data and you can do the same inside your handler like:

nameEntry.Text = string.Empty;
ageEntry.Text = string.Empty;
numberOfSavedData++;
//click handler
if (numberOfSavedData == numberOfPlayers)
{
    EntriesStackLayout.Children.Remove(nameEntry);
    EntriesStackLayout.Children.Remove(ageEntry);
    //etc...
}

Answer 2

In your xaml.cs, you can do this

for(var i = 0; i < 10; i++)
{
    Panel.Children.Add(new Entry());
}

In your xaml, you have something like

<StackLayout x:Name=Panel/>

A better solution would be to create a ContentView in xaml (ie PlayerTemplate), then, you can do

for(var i = 0; i < 10; i++)
{
    Panel.Children.Add(new PlayerTemplate());
}

Edit: If you want to store the data, you can do the following

In your ViewModel class, you have:

public IEnumerable<PlayerViewModel> Players {get; set;}

Of course, your viewmodel should implement INotifyPropertyChanged and you should raise the event when you set your Players property

Then in your view, you can do this:

foreach(var player in myViewModel.Players)
{
    Panel.Children.Add(new PlayerTemplate{ BindingContext = player });
}

The bindings will update each player.