Add simple items to Maui ListView

Question

I'm trying to feed a simple list of items to a ListView (other Android platforms require much less effort).

I have this markup:

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         x:Class="MauiApp1.NewPage1"
         Title="NewPage1">


<ScrollView>
    
<VerticalStackLayout>
    <Label 
        Text="Welcome to .NET MAUI!"
        VerticalOptions="Center" 
        HorizontalOptions="Center" />

        <Button Text="Back;"
              x:Name="cmdBack"
              Clicked="cmdBack_Clicked"
              WidthRequest="100"
               HorizontalOptions="Start"
               VerticalOptions="Start"
               CornerRadius="10"
        
         />

        <Button Text="Load ListView;"
              x:Name="cmdLoad"
              Clicked="cmdLoad_Clicked"
              WidthRequest="100"
               HorizontalOptions="Start"
               VerticalOptions="Start"
               CornerRadius="10"
        
         />

        <ListView x:Name="ListView1" >
            <ListView.ItemTemplate>
                <DataTemplate>
                    <TextCell Text="{Binding myitemname}"
                  Detail="this is some detail text" />
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>


    </VerticalStackLayout>

</ScrollView>

</ContentPage>

And code behind is this:

public NewPage1()
{
    InitializeComponent();
}


private void cmdBack_Clicked(object sender, EventArgs e)
{

    Navigation.PopAsync();

}

private void cmdLoad_Clicked(object sender, EventArgs e)
{
    List<oneitem> MyItems = new List<oneitem>();    

    for (int i = 1;i <= 3;i++)
    {
        oneitem OneNewitem = new oneitem();
        OneNewitem.myitemname = "This is item " + i.ToString();
        MyItems.Add(OneNewitem);    
    }

    ListView1.SetBinding(ItemsView.ItemsSourceProperty, "MyItems");
}
public class oneitem
{
    public string myitemname; 
}

When running the above, no code errors, but the ListView does not display data.

So, the goal is to use a simple for/next loop, and feed the ListView a few items based on that simple loop.

The above page results in this:

So, I'm expecting the result to be:

 This is item 1
 This is item 2
 This is item 3

How can I make above code work?

Answer 1

To add the items to the ListView per your requirement, please attend to the items below:

1. Change MyItems as ObservableCollection like below:

public  ObservableCollection<oneitem> MyItems { get; set; } =new ObservableCollection<oneitem>();

2. Assign the ItemsSource property of the ListView in the Constructor:

ListView1.ItemsSource = MyItems;

3. Don't forget setting the BindingContext of the Page in code-behind:

BindingContext = this;

Code-behind:

public partial class MainPage : ContentPage
{
      public  ObservableCollection<oneitem> MyItems { get; set; } =new ObservableCollection<oneitem>();

        public MainPage()
        {
            InitializeComponent();
            ListView1.ItemsSource = MyItems;
            BindingContext = this;
        }

        private void cmdLoad_Clicked(object sender, EventArgs e)
        {        
            for (int i = 1; i <= 3; i++)
            {
                oneitem OneNewitem = new oneitem();
                OneNewitem.myitemname = "This is item " + i.ToString();
                MyItems.Add(OneNewitem);
            }
        }
    }

    public class oneitem
    {
        public string myitemname { get; set; }
    }

Output: