Theodorus Agum Gumilang
Theodorus Agum Gumilang

Reputation: 1486

How to Binding Image From ViewModel Without Listview On Xamarin

i create model that has 3 data which is id, name , image

public class PromoB
{
    public string id { get; set; }
    public string name { get; set; }
    public string image { get; set; }
}

and this data is obtained from HttpGetMethod , i'm able to get the data and binding it to my listview. But i'm still confused when i want just to select the image and bind it to my Image Source. I try Bind my ImageSource to PromoB (my model) but the image not shows up. here is my viewmodel right now

private ObservableCollection<PromoB> promo;
public ObservableCollection<PromoB> Promo
{
    get { return promo; }
    set { promo = value; }
}

public PromoViewModel()
{
    // Here you can have your data form db or something else,
    // some data that you already have to put in the list

    Promo = new ObservableCollection<PromoB>();

    // Web service call to update list with new values  

    MyHTTP.GetPromoB(list =>
    {
        foreach (PromoB item in list)
            Promo.Add(item);
    });
}

and my Task to get the Data

public static async Task GetPromoB(Action<IEnumerable<PromoB>> action)
{
    string sUrl = "myurl";
    string sContentType = "application/json"; // or application/xml

    HttpClient oHttpClient = new HttpClient();
    var oTaskPostAsync = await oHttpClient.GetAsync(sUrl);
    if (oTaskPostAsync.IsSuccessStatusCode)
    {
        string content = await oTaskPostAsync.Content.ReadAsStringAsync();
        List<PromoB> o = JsonConvert.DeserializeObject<List<PromoB>>(content);
        action(o);
    }
}

and i try to binding the data in my view like this

<Image Source="{Binding Promo}" HeightRequest="167" />

so how exactly i should bind the data to my ImageSource because in listview first i bind mylistview to PromoB and then i bind ImageSource using image bind label using name. Im still not familiar with viewmodel . Your answer will very helpfull to me thanks

here is my full Xaml

<StackLayout Spacing="0">
    <Image Source="{Binding Promo}" 
           HeightRequest="167" />   
</StackLayout>

Upvotes: 0

Views: 716

Answers (1)

Greggz
Greggz

Reputation: 1809

  1. Given Items is of ObservableCollection<PromoB> only use FlowItemsSource = {Binding Items}.. You're using the default ItemsSource aswell.

  2. Make sure the BindingContext is of type PromoViewModel

  3. You're using Promo but you probably meant Promo.image, also Promo needs to belong to the BindingContext

Upvotes: 0

Related Questions