Search code examples
c#xamlmaui

Databinding doesnt work in my xaml.cs file


I am trying to load some data from my Model to the xaml.cs file. But it doesn't work. In my Mainpage.xaml i have a binding property inside a label. In the code behind file a BindingContext to my ViewModel und there i have a List with some data of type Do i miss something?

MainPage.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="DatabindingNavListExample.MainPage"
             xmlns:models="clr-namespace:DatabindingNavListExample.Models"
             xmlns:viewmodels="clr-namespace:DatabindingNavListExample.ViewModels">
    <ScrollView>
        <VerticalStackLayout>
            <Label FontSize="50" Text="{Binding Userdata.Username}" />
            <Label FontSize="50" Text="{Binding Userdata.Firstname}" />
            <Label FontSize="50" Text="{Binding Userdata.Lastname}" />
        </VerticalStackLayout>
    </ScrollView>
</ContentPage>

MainPage.xaml.cs

using DatabindingNavListExample.ViewModels;
namespace DatabindingNavListExample;
public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();
        BindingContext = new MainPageViewModel();
    }
}

MainPageViewModel.cs

using DatabindingNavListExample.Models;

namespace DatabindingNavListExample.ViewModels {
    public class MainPageViewModel {

        public List<UserModel> Userdata { get; set; } = new();

        public MainPageViewModel() { 
            Userdata.Add(new UserModel() { Username = "test", Firstname = "John", 
            Lastname = "Doe"});
        }
    }
}

UserModel.cs

using System.ComponentModel;
using System.Runtime.CompilerServices;

namespace DatabindingNavListExample.Models {
    public class UserModel : INotifyPropertyChanged {
    private string username;
    private string firstname;
    private string lastname;

    public string Username {
        get => username; set {
            username = value;
            OnPropertyChanged();
        }
    }
    public string Firstname {
        get => firstname; set {
            firstname = value;
            OnPropertyChanged();
        }
    }
    public string Lastname {
        get => lastname; set {
            lastname = value;
            OnPropertyChanged();
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected void OnPropertyChanged([CallerMemberName] string propName = null) {
        PropertyChanged?.Invoke(this,
             new PropertyChangedEventArgs(propName));
    }
}

}


Solution

  • Since the Userdata only contains one instance of UserModel, you need to explicitly assign it as Jason suggested like below:

     <ScrollView>
            <VerticalStackLayout>
                <Label FontSize="50" Text="{Binding Userdata[0].Username}" /> 
                <Label FontSize="50" Text="{Binding Userdata[0].Firstname}" />
                <Label FontSize="50" Text="{Binding Userdata[0].Lastname}" />
            </VerticalStackLayout>
     </ScrollView>