Simple list view in MAUI

Question

I am sorry about this simple question, but I am traing to write my first code in MAUI.

I want to code simple list view which shows data from list.

My code behind:

    public partial class MainPage : ContentPage

    {

        List<string> ListsToCheck { get; set; } = new List<string>() ;

        public MainPage()

        {

            ListsToCheck.Add("Room 101");

            ListsToCheck.Add("Room 102");

            ListsToCheck.Add("Room 103");

            ListsToCheck.Add("Room 104");

            InitializeComponent();

            lvList.ItemsSource = ListsToCheck;          
}     
}

XAML

 ItemsSource="{Binding ListsToCheck}">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <StackLayout>
                            <Label Text="{Binding .}" />
                        </StackLayout>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

This code creates ListView, populates it with items from LIST but item string isnt trasported to the ui, in result all ListView items are empty.

How to fix my problem.

Answer 1

Hello,

Firstly, please add ViewCell in ListView's <DataTemplate> like following code.

<ListView x:Name="lvList" ItemsSource="{Binding ListsToCheck}"  >
    <ListView.ItemTemplate>
           <DataTemplate>

              <ViewCell>

                   <StackLayout>
                        <Label Text="{Binding .}" />
                  </StackLayout>

             </ViewCell>

            </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Then set your List<string> ListsToCheck to Public, remove lvList.ItemsSource = ListsToCheck; and add BindingContext = this;, your Listview will appear.

public partial class MainPage : ContentPage
{
    public List<string> ListsToCheck { get; set; } = new List<string>();
    public MainPage ()
	{
		InitializeComponent();
        ListsToCheck.Add("Room 101");
 
        ListsToCheck.Add("Room 102");
 
        ListsToCheck.Add("Room 103");
 
        ListsToCheck.Add("Room 104");
 
        InitializeComponent();
 
        // lvList.ItemsSource = ListsToCheck;
 
        BindingContext = this;
    }
}

Here is a document about Bindings and collections, you can refer to it.

Best Regards,

Leon Lu

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.