Xamarin Forms ListView Binding issue

Question

Im having a problem with data binding in Xamarin forms ListView

1. I have class that holds the data to be bind, at run time i see data in the object.
2. i created an ObservableCollection that i'm adding my objects in a loop into it, at run time i see the objects and there data are in this object
3. Im adding ItemSource to the list And ItemTemplate as well.
4. the Items are added to the listView but at run time the Label name is null.

this is the page code:

using System;
using System.Collections.Generic;
using Punteam.GetTraderStatusApi;
using Punteam.ReceiveTraderStatusApi;
using Xamarin.Forms;
using System.Threading;
using System.Threading.Tasks;
using Newtonsoft.Json.Schema;
using Newtonsoft.Json;
using Newtonsoft.Json.Serialization;
using Newtonsoft.Json.Linq;
using XLabs.Forms.Controls;
using System.Collections;
using System.Collections.ObjectModel;
using Punteam.RequestChatMessages;
using Punteam.ReceiveChatMessages;
using System.Diagnostics;

namespace Punteam
{

public partial class ChatForm : ContentPage
{
    ObservableCollection <chatDataSource> source;
    StatusAPI getStatus;
    bool KeyboardStatus = false;


    public ChatForm ()
    {
        InitializeComponent ();
        if (Device.OS == TargetPlatform.iOS) {
            txtMsg.HeightRequest = 34;
            btnTxt.HeightRequest = 34;
            btnPick.HeightRequest = 60;
        }


        double bottomOffset;
        Int32 i = 0;
        getStatus = new StatusAPI ();
        getStatus.json.memberList [0].memberId = App.memberId;
        getStatus.json.pType = Constants.pTypeTraderStatus;
        SendRequest (getStatus, Constants.pTypeTraderStatus, this);


        btnTxt.Clicked += (object sender, EventArgs e) => {
            i++;
            System.Diagnostics.Debug.WriteLine ("In button Clicked: " +   i.ToString ());
            if (Device.OS == TargetPlatform.Android) {
                btnPick.IsVisible = true;
            }
            txtMsg.Text = "";
        };


        KeyboardHelper.KeyboardChanged += (sender, e) => {
            if (KeyboardStatus) {
            } else {
            }
            bottomOffset = mainStack.Bounds.Bottom -     textStack.Bounds.Bottom;   // This offset allows us to only raise the     stack by the amount required to stay above the keyboard. 
                textStack.TranslationY -= e.Visible ? e.Height -       bottomOffset : bottomOffset - e.Height;  // The textStack is translated up,  and then returned to original position.
        };
    }


    public  static async Task<string> SendRequest (Object obj, String    pType, ChatForm chat)
    {
        // Get Trader status    
        String jsonSring = "";
        Utils util = new Utils ();
        jsonSring = util.deserialze (obj);
        var result = await Http.SendData (Constants.serverAddress, jsonSring, true);
        string inputStr = (string)result;
        Punteam.ReceiveTraderStatusApi.RootObject traderStatus = new    Punteam.ReceiveTraderStatusApi.RootObject ();
        traderStatus =  JsonConvert.DeserializeObject<Punteam.ReceiveTraderStatusApi.RootObject>   (inputStr);

        // Get Chat last messages
        ChatdAPI chatApi = new ChatdAPI ();
        chatApi.json.pType = Constants.puTypeGetChatMessages; 
        chatApi.json.memberList [0].memberId = App.memberId;
        jsonSring = "";
        jsonSring = util.deserialze (chatApi);
        result = await Http.SendData (Constants.serverAddress, jsonSring, true);
        Punteam.ReceiveChatMessages.ReceivedMemberMessages memberMessages = new Punteam.ReceiveChatMessages.ReceivedMemberMessages ();
        memberMessages = JsonConvert.DeserializeObject<Punteam.ReceiveChatMessages.ReceivedMemberMessages> (result);

        chat.fillChatList (memberMessages);
        return result;
    }

    public void fillChatList   (Punteam.ReceiveChatMessages.ReceivedMemberMessages memberMessages)
    {
        var chatLine = new chatDataSource ();
        source = new ObservableCollection<chatDataSource> ();
        Int32 chatIndex = memberMessages.MemberChatMessagesData.Count;
        for (int i = 0; i < chatIndex; i++) {
            chatLine = new chatDataSource ();
            chatLine.senderName = memberMessages.MemberChatMessagesData [i].SenderName;
            chatLine.text = memberMessages.MemberChatMessagesData [i].Message;
            source.Add (chatLine);
        }

        chatList.ItemsSource = source;

        chatList.ItemTemplate = new DataTemplate (() => {


            var name = new Label ();

            return new ViewCell{ View = name };
        });
    }

    public void txtMsgFocused (Object s, EventArgs a)
    {
        if (Device.OS == TargetPlatform.Android) {
            btnPick.IsVisible = false;
        }
    }

    public void txtMsgCompleted (Object s, EventArgs a)
    {
        if (Device.OS == TargetPlatform.Android) {
            btnPick.IsVisible = true;
        }

    }
    *
    public void sendClicked (Object s, EventArgs a)
    {
        if (Device.OS == TargetPlatform.Android) {
            btnPick.IsVisible = true;
        }

    }

    public void itemTapped (Object s, EventArgs a)
    {
        if (Device.OS == TargetPlatform.Android) {
            btnPick.IsVisible = true;
        }
    }


}

public class chatDataSource
{
    public string senderName = "";
    public string text = "";
}
}

Answer 1

In your ListView you have to bind the views to the model class attributes.

In your case the model class "chatDataSource" has senderName and text.

So the binding in your xaml should look like below :

<Label x:Name="labelname" Text="{Binding senderName}" /> 

or Text="{Binding text}"

Please make sure the name in the Binding property and the name of the attribute in your Model class should exactly be the same.

Answer 2

Found the issue: the datasource class looks like this

public class chatDataSource
{
    public string senderName = "";
    public string text = "";
}

And it should have it's fields be properties like this:

    public class chatDataSource
{

    public string senderName { get; set; }

    public string text { get; set; }
}