Xamarin表单,如何在列表视图中刷新图像?

时间:2017-10-02 21:48:08

标签: android image listview xamarin.forms

<ListView x:Name="PictureListView" HasUnevenRows="True" WidthRequest="320" HeightRequest="400" SeparatorColor="White">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Image Source="{Binding Path}" HeightRequest="80" WidthRequest="80" Aspect="AspectFill" />
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

ObservableCollection<Image> Pictures = new ObservableCollection<Image>(new Image { Source = "file.png" });
PictureListView.ItemSource = Pictures;

   private async void PictureListView_ItemTapped(object sender, ItemTappedEventArgs e)
{
  var photo = (Image)e.Item;
 photo.Source = "file2.png";
}

我正在尝试使用xamarin表单更新listview中的图像....我有上面列出的代码....但是当点击触发时,新图像(“file2.png”)没有得到重新粉刷到屏幕上。相反,我只是一个空白的空间,可以看到图像的位置。如何在列表视图中更改图像?

2 个答案:

答案 0 :(得分:0)

您正在使用ObservableCollection,它只会在更新集合(添加,移动,删除)时更新列表视图。在您的情况下,您只是更新项目的内容,因此它不会反映在屏幕上。

您应该使用适当的数据绑定或MVVM实现您的代码。阅读有关MVVM HERE的更多信息。

如果您不想实现MVVM,可以使用以下技巧。

private async void PictureListView_ItemTapped(object sender, ItemTappedEventArgs e)
{
    var photo = (Image)e.Item;
    var newImage = new Image { Source = "file2.png" };
    var index = Pictures.IndexOf(photo);
    Pictures.Remove(photo);
    Pictures.Insert(index, newImage);
}

答案 1 :(得分:0)

您应该实现INotifyPropertyChanged

这是一个示例代码

using System;
using System.ComponentModel;
using Xamarin.Forms;

namespace XamlSamples
{
    class ClockViewModel : INotifyPropertyChanged
    {
        DateTime dateTime;

        public event PropertyChangedEventHandler PropertyChanged;

        public ClockViewModel()
        {
            this.DateTime = DateTime.Now;

            Device.StartTimer(TimeSpan.FromSeconds(1), () =>
                {
                    this.DateTime = DateTime.Now;
                    return true;
                });
        }

        public DateTime DateTime
        {
            set
            {
                if (dateTime != value)
                {
                    dateTime = value;

                    if (PropertyChanged != null)
                    {
                        PropertyChanged(this,
                            new PropertyChangedEventArgs("DateTime"));
                    }
                }
            }
            get
            {
                return dateTime;
            }
        }
    }
}

这里有一些文档

data_bindings_to_mvvm