使用 dataBinding 根据 Web 服务值将图像放入列表视图项中

本文关键字:列表 视图 图像 根据 dataBinding Web 服务 使用 | 更新日期: 2023-09-27 18:35:41

我有一个列表视图,每个列表视图项目都有一个默认图像列表,如果从 Web 服务恢复的值不同于 0,这些图像将被其他图像替换这是 JSON 数据:

{
success: 1,
total: 2,
locals: [
{
id_local: "82",
fav: 0,
aime: 0,
aimepas: 0,
},
{
id_local: "83",
fav: 1,
aime: 1,
aimepas: 0,
}
]
}

我尝试了以下代码:

ObservableCollection<Item> Locals = new ObservableCollection<Item>();
  public async void getListePerSearch()
    {
            UriS = "URL";
            var http = new HttpClient();
            http.MaxResponseContentBufferSize = Int32.MaxValue;
            var response = await http.GetStringAsync(UriS);
            var rootObject1 = JsonConvert.DeserializeObject<NvBarberry.Models.RootObject>(response);
            listme.ItemsSource = rootObject1.locals;

                foreach (var item in listme.Items.Cast<Locals>())
                {
                    if (item.fav == 1)
                    {
                        btnStar.Background = new SolidColorBrush(Colors.Yellow); //yellow
                        //Debug.Write("fav=1");
                    }
                    else
                    {
                        btnStar.Background = new SolidColorBrush(Colors.Gray);//Gray
                        //Debug.Write("fav=0");
                    }
                    if (item.aime == 1)
                    {
                        coeur.Source = new BitmapImage(new Uri("ms-appx:///images/11.png", UriKind.Absolute));
                        //Debug.Write("aime=1");
                    }
                    else
                    {
                        coeur.Source = new BitmapImage(new Uri("ms-appx:///images/1.png", UriKind.Absolute));
                        //Debug.Write("aime=0");
                    }
                    if (item.aimepas == 1)
                    {
                        deslikeimage.Source = new BitmapImage(new Uri("ms-appx:///images/22.png", UriKind.Absolute));
                        //Debug.Write("aimepas=1");
                   }
                    else
                   {
                        deslikeimage.Source = new BitmapImage(new Uri("ms-appx:///images/2.png", UriKind.Absolute));
                       //Debug.Write("aimepas=0");
                   }
               }

这是当地人.cs:

  public class Locals
{
    public int fav { get; set; }
    public int aime { get; set; }
    public int aimepas { get; set; }
}

这是 XAML 文件:

<ListView  x:Name="listme">
 <ListView.ItemTemplate >
   <DataTemplate >
     <Grid>
       ...
      <Button Background="Gray"  x:Name="btnStar"/>
      <Button>
           <Image Source="images/1.png" x:Name="coeur"/>
      </Button>
       <Button>
           <Image Source="images/2.png" x:Name="deslikeimage"/>
      </Button>
     </Grid>
   </DataTemplate >
 </ListView.ItemTemplate >
</ListView >

所以我的问题是,如何在我的情况下使用数据绑定感谢您的帮助

使用 dataBinding 根据 Web 服务值将图像放入列表视图项中

类 Item 必须实现 INotifyPropertyChanged 以在某些属性更改后通知视图,之后您需要在列表控件中将 ObservableCollection Locals 设置为 ItemsSource。

这是文档。

https://msdn.microsoft.com/library/windows/apps/windows.ui.xaml.data.inotifypropertychanged.propertychanged.aspx

您需要了解什么是绑定如何使用它。

http://blogs.msdn.com/b/jerrynixon/archive/2012/10/12/xaml-binding-basics-101.aspx

下面是一个示例:

public class Employee : INotifyPropertyChanged 
{
    private string myUrl;
    private string myUrl2;
    public string MyUrl
    {
        get { return myUrl; }
        set
        {
            _name = value;
            RaisePropertyChanged("MyUrl");
        }
    }
    public string MyUrl2
    {
        get { return myUrl2; }
        set
        {
            _organization = value;
            RaisePropertyChanged("MyUrl2");
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    protected void RaisePropertyChanged(string name)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(name));
        }
    }
}

现在在你的前者:

     foreach (var item in MyOriginalCollection)
            {

你的逻辑在这里...

Locals.Add(Item); }

最后,您需要将本地人集合设置为列表控件。

ObservableCollection 在添加或删除某些对象时通知视图。

这是文档https://msdn.microsoft.com/en-us/library/ms668604(v=vs.110).aspx

在 Xaml 中

您需要个性化列表控件的项模板

<ListView x:Name="myList"
                             >

                <ListView.ItemTemplate>
                    <DataTemplate>
                        <Button>
                        <Image Source="{Binding MyUrl}" x:Name="coeur"/>
                        </Button>
                          <Button>
                        <Image Source="{Binding MyUrl2}" x:Name="coeur"/>
                        </Button>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

我希望这些信息和示例对您有用。

我知道有很多概念需要学习。

下面是一个演示如何使用绑定方法的最后一个示例

http://10rem.net/blog/2012/03/27/tip-binding-an-image-elements-source-property-to-a-uri-in-winrt-xaml