Search code examples
azurexamarinxamarin.formsazure-blob-storagedatatemplateselector

Xamarin.Forms Bindings - Same property value is binded to every item in ListView


When I am loading an image from Azure Storage Account in Xamarin.Forms mobile app and then binding it to item in ListView. Same image is binded to every item. I am using DataTemplateSelector to select the item template and to set the image.

My Code DataTemplateSelector:

protected override DataTemplate OnSelectTemplate(object item, BindableObject container)
    {
var newIsIncoming = false; 
        var m = item as MainChatPage;
        var messageVm = item as Message;
        if (messageVm == null)
            return null;

        var template = this.outgoingDataTemplate; ;

        if (messageVm.Autor == AppName.Helpers.Settings.Username && messageVm.ImageName == null && messageVm.Text != null)
        {
            template = this.outgoingDataTemplate;
        }

        if (messageVm.Autor != AppName.Helpers.Settings.Username && messageVm.ImageName == null && messageVm.Text != null)
        {
            template = this.incomingDataTemplate;
        }

        if (messageVm.Autor != AppName.Helpers.Settings.Username && messageVm.ImageName != null && messageVm.Text == null)
        {

            Load(messageVm.Autor, messageVm.ImageName);
            messageVm.Imagesource = NewFinalImage;
            template = this.incomingImageDataTepmlate;
        }

        if (messageVm.Autor == AppName.Helpers.Settings.Username && messageVm.ImageName != null && messageVm.Text == null)
        {
            Load(messageVm.Autor, messageVm.ImageName);
            messageVm.Imagesource = NewFinalImage;
            template = this.outgoingImageDataTemplate;

        }
}

async void Load(string containerName, string imageName)
    {          
        var imageNew = await GetImage(imageName, containerName);

        NewFinalImage = ImageSource.FromStream(() => new MemoryStream(imageNew));
    }

My Code MessageViewModel:

public class MessageViewModel : MvvmHelpers.ObservableObject
{
    string id;

    [JsonProperty(PropertyName = "id")]
    public string Id
    {
        get { return id; }
        set { SetProperty(ref id, value); }
    }

    string text;

    [JsonProperty(PropertyName = "text")]
    public string Text
    {
        get { return text; }
        set { SetProperty(ref text, value); }
    }

    string comesFrom;

    [JsonProperty(PropertyName = "comesfrom")]
    public string ComesFrom
    {
        get { return comesFrom; }
        set { SetProperty(ref comesFrom, value); }
    }

    string userImageName;

    [JsonProperty(PropertyName = "userimagename")]
    public string UserImageName
    {
        get { return userImageName; }
        set { SetProperty(ref userImageName, value); }
    }

    ImageSource userImageSource;

    [JsonIgnore]
    public ImageSource UserImageSource
    {
        get { return userImageSource; }
        set { SetProperty(ref userImageSource, value); }
    }

    string autor;

    [JsonProperty(PropertyName = "autor")]
    public string Autor
    {
        get { return autor; }
        set { SetProperty(ref autor, value); }
    }

    string os;

    [JsonProperty(PropertyName = "os")]
    public string OS
    {
        get { return os; }
        set { SetProperty(ref os, value); }
    }

    DateTime messageDateTime;

    [JsonProperty(PropertyName = "messagedatetime")]
    public DateTime MessageDateTime
    {
        get { return messageDateTime; }
        set { SetProperty(ref messageDateTime, value); }
    }

    public string MessageTimeDisplay => MessageDateTime.Humanize(culture: CultureInfo.CurrentCulture);

    bool isIncoming;

    [JsonProperty(PropertyName = "isincoming")]
    public bool IsIncoming
    {
        get { return isIncoming; }
        set { SetProperty(ref isIncoming, value); }
    }

    /*[JsonProperty(PropertyName = "image")]
    public string Image { get; set; }*/

    bool viewerIsIncoming;

    [JsonProperty(PropertyName = "viewerisincoming")]
    public bool ViewerIsIncoming
    {
        get { return viewerIsIncoming; }
        set { SetProperty(ref viewerIsIncoming, value); }
    }

    string type;

    [JsonProperty(PropertyName = "type")]
    public string Type
    {
        get { return type; }
        set { SetProperty(ref type, value); }
    }

    string imageName;

    [JsonProperty(PropertyName = "image")]
    public string ImageName
    {
        get { return imageName; }
        set { SetProperty(ref imageName, value); }
    }


    ImageSource image;

    [JsonIgnore]
    public ImageSource Imagesource
    {
        get { return image; }
        set { SetProperty(ref image, value); }
    }

    string video;

    [JsonProperty(PropertyName = "video")]
    public string Video
    {
        get { return video; }
        set { SetProperty(ref video, value); }
    }

    string sound;


    [JsonProperty(PropertyName = "sound")]
    public string Sound
    {
        get { return sound; }
        set { SetProperty(ref sound, value); }
    }
}

What am I doing wrong ?

Thank you !


Solution

  • You are not binding the messageVm.Imagesource correct, you are setting the imagesource to NewFinalImage which is not a part of the item-object. It seems that NewFinalImage is some variable outside of the item object. In order to get it to work, you will have to store the image url or filename in the item object.

    That should work, I hope this information will help you!