.net Maui Binding object doesnt show in app

João Marques 0
Viewed 64

Can anyone please tell me why I can't see the Tarefa.Condutor text variable in a label in my app? The Label in the app appears empty. What am I doing wrong? I think it's because of the Text="{Binding Tarefa.Condutor}" that doesn't binds correctly.

I have this code in .xaml file:

ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="GesfrotaTarefasApp.MVVM.Views.DashboardPage"
             xmlns:vm="clr-namespace:GesfrotaTarefasApp.MVVM.ViewModels"
             Title="DashboardPage">

    <ContentPage.BindingContext>
        <vm:DashboardViewModel />
    </ContentPage.BindingContext>

    <StackLayout BackgroundColor="White">
<Button x:Name="botao" Text="Carrega dados" Command="{Binding GetTarefaFakeCommand}" CommandParameter="{Binding CommandParam}"></Button>
        <Label x:Name="Teste" Text="{Binding Tarefa.Condutor}" FontSize="14" TextColor="Black"></Label>
</StackLayout>
</ContentPage>

And this code in .xaml.cs:

public partial class DashboardPage : ContentPage
{
    IConnectivity connectivity;

    public DashboardPage()
    {
        InitializeComponent();
        BindingContext = new DashboardViewModel();
    }
}

And this code in ViewModel.cs:

public partial class DashboardViewModel : BaseViewModel
    {
        HttpClient httpClient;

        private int commandParam = 1;
        public int CommandParam
        {
            get
            {
                return commandParam;
            }
            set
            {
                SetProperty(ref commandParam, value);
            }
        }

        private TarefaDTO tarefa;
        public TarefaDTO Tarefa
        {
            get
            {
                return tarefa;
            }
            set
            {
                SetProperty(ref tarefa, value);
            }
        }

        public DashboardViewModel()
        {
            Title = "Dashboard";
            httpClient = new HttpClient();

            tarefa = new TarefaDTO();
        }

public async Task<List<TarefaDTO>> GetTarefaFromFake()
        {
            return await Task.FromResult(new List<TarefaDTO>
                {
                    new TarefaDTO(){ Cliente = "Joao", Condutor = "Luis", DataCriacao = DateTime.Now, 
                        Estado = "Activo", IdTarefaEstado = 1, IdCondutor = 1, Id = 1 }, new TarefaDTO(){ Cliente = "Nuno", Condutor = "Fabio", DataCriacao = DateTime.Now, Estado = "Activo", IdTarefaEstado = 2, IdCondutor = 2, Id = 2 } , new TarefaDTO(){ Cliente = "Marta", Condutor = "Luisa", DataCriacao = DateTime.Now, Estado = "Activo", IdTarefaEstado = 3, IdCondutor = 3, Id = 3 }
                });
        }

        [RelayCommand]
        public async Task<TarefaDTO> GetTarefaFake(int? idTarefa)
        {
            var listaTarefas =  await GetTarefaFromFake();
            var novatarefa = listaTarefas.Where(t => t.Id == idTarefa).SingleOrDefault();
            return novatarefa;
        }

And my model is here:

public class TarefaDTO
    {
        public int Id { get; set; }
        public string Cliente { get; set; }
        public string Condutor { get; set; }
        public string Estado { get; set; }
        public DateTime DataCriacao { get; set; }
        public int IdCondutor { get; set; }
        public int IdTarefaEstado { get; set; }
    }
.net-maui maui visual-studio .net
1 Answers

There are several problems in your code.

1.You are setting your BindingContext in both the XAML and the code behind just as Jason said. You can remove one .

2.After creating a new instance of class TarefaDTO for variable tarefa , you didn't assign value for it, so you will get null for Label (<Label x:Name="Teste" Text="{Binding Tarefa.Condutor}"/>.

Here, as a test, you can initialize value for variable tarefa .

      public DashboardViewModel()
    {
        Title = "Dashboard";
        httpClient = new HttpClient();

        tarefa = new TarefaDTO();
        tarefa.Condutor ="test_Conductor";
    }

3.Suppose you want to get the data indexed by the first object(private int commandParam = 1;), and you can assign it to Tarefa, you can do like this:

  Tarefa = GetTarefaFake(index);

Based on your code, I created a demo, and it works on my side, you can refer to the following code:

      public class DashboardViewModel: BaseViewModel 
{

    HttpClient httpClient;

    private int commandParam = 1;
    public int CommandParam
    {
        get
        {
            return commandParam;
        }
        set
        {
            SetProperty(ref commandParam, value);
        }
    }


    private TarefaDTO tarefa;
    public TarefaDTO Tarefa
    {
        get
        {
            return tarefa;
        }
        set
        {
            SetProperty(ref tarefa, value);
        }
    }

    public ObservableCollection<TarefaDTO> items { get; set; }
    public ICommand MyCommand { private set; get; }

    public DashboardViewModel()
    {
        Title = "Dashboard";
        httpClient = new HttpClient();

        tarefa = new TarefaDTO();
        tarefa.Condutor = "test123456";

        items = new ObservableCollection<TarefaDTO>();
        MyCommand = new Command<int>(TestMethod);
    }

    private async void TestMethod(int obj)
    {
        Tarefa = await GetTarefaFake(obj);
    }

    public async Task<List<TarefaDTO>> GetTarefaFromFake()
    {
        return await Task.FromResult(new List<TarefaDTO>
            {
                new TarefaDTO(){ Cliente = "Joao", Condutor = "Luis", DataCriacao = DateTime.Now,
                    Estado = "Activo", IdTarefaEstado = 1, IdCondutor = 1, Id = 1 }, new TarefaDTO(){ Cliente = "Nuno", Condutor = "Fabio", DataCriacao = DateTime.Now, Estado = "Activo", IdTarefaEstado = 2, IdCondutor = 2, Id = 2 } , new TarefaDTO(){ Cliente = "Marta", Condutor = "Luisa", DataCriacao = DateTime.Now, Estado = "Activo", IdTarefaEstado = 3, IdCondutor = 3, Id = 3 }
            });
    }

    //[RelayCommand]
    public async Task<TarefaDTO> GetTarefaFake(int? idTarefa)
    {
        var listaTarefas = await GetTarefaFromFake();
        var novatarefa = listaTarefas.Where(t => t.Id == idTarefa).SingleOrDefault();
        return novatarefa;
    }
}

And the xaml is:

  <Button x:Name="botao" Text="Carrega dados" Command="{Binding MyCommand}" CommandParameter="{Binding CommandParam}"></Button>
  <Label x:Name="Teste" Text="{Binding Tarefa.Condutor}" FontSize="14" TextColor="Black"></Label>
Jessie Zhang -MSFT0
Related