Блог

Мне нужно привязать изображения из ViewModel, которые взяты с камеры, к изображению внутри FlowListView. Мне нужно связать 20 изображений одно за другим. Мне удалось обновить коллекцию ObservableCollection, но я не могу связать изображения. Я использую плагин.Медиа-нугет для фотосъемки. Мне нужно использовать ViewModel, а не код.

XAML…

         <flv:FlowListView Grid.Row="0" FlowColumnCount="4" BackgroundColor="White" SeparatorVisibility="None"
                          HasUnevenRows="True" FlowItemTappedCommand="{Binding ItemTappedCommand}"
                          FlowItemsSource="{Binding Items}">

            <flv:FlowListView.FlowColumnTemplate>
                <DataTemplate>
                    <Frame BackgroundColor="LightGray" HasShadow="False" Margin="5">
                        <Image Source="{Binding img}" Aspect="AspectFill" />
                    </Frame>
                </DataTemplate>
            </flv:FlowListView.FlowColumnTemplate>

        </flv:FlowListView>
 

Модель…

 public class FirePhotoUploadModel
{
    public int id { get; set; }
    public string name { get; set; }
    public ImageSource img { get; set; }
}
 

Модель просмотра…

 public class FirePhotoUploadVM : INotifyPropertyChanged
{

    private ObservableCollection<FirePhotoUploadModel> _items = new ObservableCollection<FirePhotoUploadModel>();
    public ObservableCollection<FirePhotoUploadModel> Items
    {
        get
        {
            return _items;
        }
        set
        {
            if (_items != value)
            {
                _items = value;
                OnPropertyChanged(nameof(Items));
            }
        }
    }

    public FirePhotoUploadVM()
    {
        AddItems();
    }

    private void AddItems()
    {
        Items.Add(new FirePhotoUploadModel { id = 0, name = "01" });
        Items.Add(new FirePhotoUploadModel { id = 1, name = "02" });
        Items.Add(new FirePhotoUploadModel { id = 2, name = "03" });
        Items.Add(new FirePhotoUploadModel { id = 3, name = "04" });
        Items.Add(new FirePhotoUploadModel { id = 4, name = "05" });
        Items.Add(new FirePhotoUploadModel { id = 5, name = "06" });
        Items.Add(new FirePhotoUploadModel { id = 6, name = "07" });
        Items.Add(new FirePhotoUploadModel { id = 7, name = "08" });
        Items.Add(new FirePhotoUploadModel { id = 8, name = "09" });
        Items.Add(new FirePhotoUploadModel { id = 9, name = "10" });
        Items.Add(new FirePhotoUploadModel { id = 10, name = "11" });
        Items.Add(new FirePhotoUploadModel { id = 11, name = "12" });
        Items.Add(new FirePhotoUploadModel { id = 12, name = "13" });
        Items.Add(new FirePhotoUploadModel { id = 13, name = "14" });
        Items.Add(new FirePhotoUploadModel { id = 14, name = "15" });
        Items.Add(new FirePhotoUploadModel { id = 15, name = "16" });
        Items.Add(new FirePhotoUploadModel { id = 16, name = "17" });
        Items.Add(new FirePhotoUploadModel { id = 17, name = "18" });
        Items.Add(new FirePhotoUploadModel { id = 18, name = "19" });
        Items.Add(new FirePhotoUploadModel { id = 19, name = "20" });
    }

    public Command ItemTappedCommand
    {
        get
        {
            return new Command(async (data) =>
            {
                var res = data as FirePhotoUploadModel;
                await CameraButton_Clicked(res.id);
            });
        }
    }

    private async Task CameraButton_Clicked(int idd)
    {

        if (await isAllPermission())
        {

            if (await isCamAvailable())
            {

                var photo1 = await CrossMedia.Current.TakePhotoAsync(new StoreCameraMediaOptions() { Directory = "SamplePhoto", Name = "image.jpg", PhotoSize = PhotoSize.MaxWidthHeight, MaxWidthHeight = 1024, CompressionQuality = 90 });

                if (photo1 != null)
                {
                    var imageStream = ImageSource.FromStream(() => { return photo1.GetStream(); });

                    var item = Items.FirstOrDefault(i => i.id == idd);
                    if (item != null)
                    {
                        item.img = imageStream;
                    }

                }

            }

        }

    }


    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {

        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}
 

Поскольку вы обновляете img FirePhotoUploadModel , вам необходимо реализовать INotifyPropertyChanged уведомление об изменении данных.

  public class FirePhotoUploadModel: INotifyPropertyChanged
{
    public int id { get; set; }
    public string name { get; set; }
    private ImageSource _img;
    public ImageSource img
    {
        get { return _img; }
        set
        {
            _img = value;
            OnPropertyChanged("img");

        }
    }
    public event PropertyChangedEventHandler PropertyChanged;
    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {

        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}