Binding a ListView with a List coming from ViewModel

Question

I'm working on a UWP app using Mvvm format for school and need help with something.

So I'm trying to make a ListView with items comming from a List that is in my ViewModel.

Here is some code :

MainScreenViewModel.cs

using EasySleep.Model;
using EasySleep.Services;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using Template10.Mvvm;
using Template10.Services.NavigationService;
using Windows.UI.Xaml.Navigation;

namespace EasySleep.ViewModels
{
    class MainScreenViewModel : ViewModelBase
    {

        ServiceApi serviceApi;

        public List<Offer> TestList { get; set; }

        public MainScreenViewModel()
        {
            serviceApi = new ServiceApi();
            TestList = new List<Offer>();
            TestList.Add(new Offer(1, true, null, "Decription de dingue", 3));
            TestList.Add(new Offer(3, false, null, "Decription de fou", 6));
            TestList.Add(new Offer(7, true, null, "Decription de perdu", 9));
        }

        public override async Task OnNavigatedToAsync(object parameter, NavigationMode mode, IDictionary<string, object> suspensionState)
        {
            await Task.CompletedTask;
        }

        public void GoToMainScreen() =>
            NavigationService.Navigate(typeof(Views.MainScreen));

        public void GotoSettings() =>
            NavigationService.Navigate(typeof(Views.SettingsPage), 0);

        public void GotoAbout() =>
            NavigationService.Navigate(typeof(Views.SettingsPage), 1);

        public void Logout()
        {
            ServiceApi.Token = null;
            NavigationService.Navigate(typeof(Views.MainPage));
        }

    }
}

MainScreenPage.xaml

<ListView x:Name="AllActiveOffersListView" 
                  ItemsSource="{x:Bind ViewModel.TestList}"
                  Grid.Row="1">
    <ListView.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="" />
        </DataTemplate>
    </ListView.ItemTemplate>
 </ListView>

Offer.cs

using Newtonsoft.Json;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace EasySleep.Model
{
    public class Offer
    {

        public int Id { get; set; }
        public Boolean IsActive { get; set; }
        public List<Photo> Photos { get; set; }
        public String Description { get; set; }
        public int MaxPeople { get; set; }
        public int LocationId { get; set; }
        public Location Location { get; set; }
        public ApplicationUser Owner { get; set; }
        public String OwnerId { get; set; }

        public Offer (int id, Boolean isActive, List<Photo> photos, string description, int maxPeople)
        {
            Id = id;
            IsActive = isActive;
            Photos = photos;
            Description = description;
            MaxPeople = maxPeople;
        }

        [JsonConstructor]
        public Offer(string description, int id, Boolean isActive, Location loc, int locationId, int maxPeople, ApplicationUser owner, string ownerId)
        {
            Id = id;
            IsActive = isActive;
            Description = description;
            MaxPeople = maxPeople;
            Location = loc;
            LocationId = locationId;
            Owner = owner;
            OwnerId = ownerId;
        }

        public override string ToString()
        {
            return Description + LocationId;
        }

    }
}

Can you help me binding these things please ?

I edited to add Offer.cs model

Answer 1

simple <TextBlock Text="{Binding Description}" /> should work, there is no need to specify anything else. I created an empty Template10 app and put there your model, and it works.

Here is the main page xaml:

<Page.DataContext>
    <vm:MainPageViewModel x:Name="ViewModel" />
</Page.DataContext>

<RelativePanel Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

    <controls:PageHeader x:Name="pageHeader"
                         Content="Main Page"
                         RelativePanel.AlignLeftWithPanel="True"
                         RelativePanel.AlignRightWithPanel="True"
                         RelativePanel.AlignTopWithPanel="True" />

    <RelativePanel EntranceNavigationTransitionInfo.IsTargetElement="True"
                   RelativePanel.AlignBottomWithPanel="True"
                   RelativePanel.AlignLeftWithPanel="True"
                   RelativePanel.AlignRightWithPanel="True"
                   RelativePanel.Below="pageHeader">

        <!--  content  -->
  <ListView x:Name="AllActiveOffersListView" 
              ItemsSource="{x:Bind ViewModel.TestList}"
              Grid.Row="1">
    <ListView.ItemTemplate>
      <DataTemplate>
        <TextBlock Text="{Binding Description}" />
      </DataTemplate>
    </ListView.ItemTemplate>
  </ListView>

</RelativePanel>

</RelativePanel>

You can download the full working project from http://personal.sirma.bg/Jogy/download/WindowsApp1.zip and check if it will work for you, then see what is different between your project and mine.

Jogy