Я не могу понять, как это делается. У меня есть страница с представлением коллекции и изображения внутри каждой ячейки. У меня также есть список URL, каждый из которых указывает на JPG. То, что я хотел бы сделать, это отобразить каждый jpg в одной из этих ячеек.
<StackLayout Margin="20">
<CollectionView ItemsSource="{Binding UrlCollection}">
<CollectionView.ItemsLayout>
<GridItemsLayout Orientation="Vertical"
Span="2" />
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate>
<Image Source="{Binding ImageUrl}"
Aspect="AspectFill" />
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>
Пока мне кажется, что мне нужно создать класс, называемый UrlCollection, и один элемент внутри этого класса URL изображения. Но я чувствую себя потерянным и не могу найти пример для подражания.
ОБНОВЛЕНИЕ Моя текущая версия. он не работает, дисплей просто пустой.
Gallery.xaml
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:vm="clr-namespace:GalShare.ViewModel"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Class="GalShare.Views.Gallery">
<ContentPage.BindingContext>
<vm:GalleryViewModel/>
</ContentPage.BindingContext>
<StackLayout>
<CollectionView ItemsSource="{Binding Gallery}">
<CollectionView.ItemsLayout>
<GridItemsLayout Orientation="Vertical"
Span="2" />
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate>
<Image Source="{Binding ImageUrl}"
Aspect="AspectFit" />
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>
Gallery.cs
using System;
using System.Collections.Generic;
using System.Text;
namespace GalShare.Model
{
class Gallery
{
public string ImageName { get; set; }
public string ImageUrl { get; set; }
}
}
GalleryService.cs
using GalShare.Model;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Text;
namespace GalShare.Service
{
class GalleryService
{
public ObservableCollection<Gallery> GetImageList()
{
return new ObservableCollection<Gallery>()
{
new Gallery() { ImageName="Image1", ImageUrl="https://www.igormasin.it/fileuploads/tanja_23a6id/IMG_0992-Edit_a.jpg"},
new Gallery() { ImageName="Image2", ImageUrl="https://www.igormasin.it/fileuploads/tanja_23a6id/IMG_1024-Edit_a.jpg"},
new Gallery() { ImageName="Image3", ImageUrl="https://www.igormasin.it/fileuploads/tanja_23a6id/IMG_1074-Edit_a.jpg"}
};
}
}
}
GalleryViewModel.cs
using GalShare.Model;
using GalShare.Service;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Text;
namespace GalShare.ViewModel
{
class GalleryViewModel
{
public ObservableCollection<Gallery> Images { get; set; }
public GalleryViewModel()
{
Images = new GalleryService().GetImageList();
}
}
}
Главная страница вызова:
MainPage = new NavigationPage(new Gallery());