Мне удалось использовать CarouselView для отображения изображений, привязав CarouselView к ObservableCollection строк, представляющих URL-адреса изображений, и напрямую ссылаясь на эти URL-адреса с помощью свойства Source тега Image в файлах XAML:
<CarouselView x:Name="carouselView" ItemsSource="{Binding CarImages}">
<CarouselView.ItemTemplate>
<DataTemplate>
<Frame>
<StackLayout>
<Label Text="{Binding FileName}"/>
<Image Source="{Binding FileName}"/>
</StackLayout>
</Frame>
</DataTemplate>
</CarouselView.ItemTemplate>
</CarouselView>
Это отображает и изображение, и имя файла, как я хотел бы.
Но теперь я пытаюсь создать CarouselView изображений, привязав CarouselView к объектам ImageSource вместо того, чтобы связывать их со строками. ObservableCollection объектов ImageSource определен в моей ViewModel:
public ObservableCollection<ImageSource> ImageSources { get; set; }
Объекты ImageSource создаются путем передачи путей к файлам в метод ImageSource.FromFile:
foreach(MediaFile photoFile in photoFiles)
{
CarViewModel.ImageSources.Add(ImageSource.FromFile(photoFile.Path));
}
Теперь я пытаюсь отобразить их в моем файле xaml:
<CarouselView ItemsSource="{Binding ImageSources}" HeightRequest="500">
<CarouselView.ItemTemplate>
<DataTemplate>
<StackLayout>
<Image Source="{Binding}"/>
</StackLayout>
</DataTemplate>
</CarouselView.ItemTemplate>
</CarouselView>
, но изображение не отображается.
Я могу отображать по одному изображению за раз:
CarViewModel.SampleImage.Source = CarViewModel.ImageSources[0];
<Image Source="{Binding SampleImage.Source}"/>
При этом отображается одно изображение.
Почему изображения не отображаются в CarouselView?
Изменить: вот вся ViewModel, как просил Лео Чжу - MSFT
using MyProgram.Models;
using MyProgram.Views;
using Plugin.Media.Abstractions;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.IO;
using Xamarin.Forms;
namespace MyProgram.ViewModels
{
public class CarDetailViewModel : BaseViewModel
{
string name, description, priceString;
DateTime date;
public ObservableCollection<Photograph> CarImages { get; set; }
public ObservableCollection<ImageSource> ImageSources { get; set; }
public ObservableCollection<Image> Images { get; set; }
public CarouselView carouselView;
private ImageSource sampleImageSource;
public ImageSource SampleImageSource
{
get
{
return sampleImageSource;
}
set
{
sampleImageSource = value;
OnPropertyChanged("SampleImageSource");
}
}
private Image sampleImage;
public Image SampleImage
{
get
{
return sampleImage;
}
set
{
sampleImage = value;
OnPropertyChanged("SampleImage");
}
}
decimal price;
Car car;
public void AddImages(List<string> fileNames, bool areNewImages)
{
if (CarImages == null || CarImages.Count == 0)
CarImages = new ObservableCollection<Photograph>();
string pathToImages = Path.GetDirectoryName(Constants.ItemsDatabasePath) + "/images/";
foreach (string fileName in fileNames)
{
string filenameInLoop = pathToImages + Path.GetFileName(fileName);
Photograph carImage = new Photograph { FileName = filenameInLoop, IsNew = areNewImages };
CarImages.Add(carImage);
OnPropertyChanged("fileName");
OnPropertyChanged("CarImages");
}
}
public void RemoveImage(Photograph imageToRemove)
{
CarImages.Remove(imageToRemove);
OnPropertyChanged("CarImages");
}
public DateTime Date
{
set
{
if (date != value)
{
Car.Date = date = value;
OnPropertyChanged("Date");
}
}
get
{
return date;
}
}
public string DatabasePath => Constants.ItemsDatabasePath;
public string Name
{
set
{
if (name != value)
{
Car.Name = name = value;
OnPropertyChanged("Name");
}
}
get
{
return name;
}
}
public string Description
{
set
{
if (description != value)
{
Car.Description = description = value;
OnPropertyChanged("Description");
}
}
get
{
return description;
}
}
public String PriceString
{
set
{
if (priceString != value)
{
priceString = value;
OnPropertyChanged("PriceString");
}
}
get
{
return priceString;
}
}
public decimal Price
{
set
{
if (price != value)
{
Car.Price = price = value;
OnPropertyChanged("Price");
}
}
get
{
return price;
}
}
public Car Car
{
set
{
if (car != value)
{
car = new Car
{
Id = value.Id,
Name = value.Name,
Price = value.Price,
Description = value.Description,
Date = value.Date
};
OnPropertyChanged("Car");
OnPropertyChanged("Id");
OnPropertyChanged("Name");
OnPropertyChanged("Price");
OnPropertyChanged("Description");
OnPropertyChanged("ImageFile");
OnPropertyChanged("Date");
}
}
get
{
return car;
}
}
public CarDetailViewModel(Car car = null)
{
MessagingCenter.Subscribe<UpdateCarPage, Car>(this, "UpdateCar", (obj, item) =>
{
Car = item;
});
if (car != null)
Car = car;
else
Car = new Car();
this.Name = Car.Name;
this.Description = Car.Description;
this.Price = Car.Price;
this.Date = Car.Date;
OnPropertyChanged("Date");
OnPropertyChanged("Car");
OnPropertyChanged("Id");
OnPropertyChanged("Name");
OnPropertyChanged("Price");
OnPropertyChanged("Description");
OnPropertyChanged("ImageFile");
}
public void ReloadCarFromDataStore()
{
string Id = Car.Id;
car = App.CarRepository.GetItemAsync(Id).Result;
}
}
}