CarouselView в XamarinForms

Я пытаюсь использовать CarouselView в проекте Xamarin. Но я не могу этого сделать. Вот установленные пакеты: CarouselView в XamarinFormsCarouselView в XamarinForms Вот код 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:local = "clr-namespace:FlowersStore"
         xmlns:cv = "clr-namespace:Xamarin.Forms;assembly=Xamarin.Forms.CarouselView"
         x:Class = "FlowersStore.MainPage">

<StackLayout>

    <Grid RowSpacing = "0">
        <Grid.RowDefinitions>
            <RowDefinition Height = ".3*"/>
            <RowDefinition Height = ".7*"/>
        </Grid.RowDefinitions>
        <cv:CarouselView ItemsSource = "{Binding Zoos}" x:Name = "CarouselZoos">
            <cv:CarouselView.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height = "*"/>
                            <RowDefinition Height = "Auto"/>
                        </Grid.RowDefinitions>
                        <Image Grid.RowSpan = "2" Aspect = "AspectFill" Source = "{Binding ImageUrl}"/>
                        <StackLayout Grid.Row = "1" BackgroundColor = "#80000000" Padding = "12">
                            <Label TextColor = "White" Text = "{Binding Name}" FontSize = "16" HorizontalOptions = "Center" VerticalOptions = "CenterAndExpand"/>
                        </StackLayout>
                    </Grid>
                </DataTemplate>
            </cv:CarouselView.ItemTemplate>
        </cv:CarouselView>
    </Grid>

</StackLayout>

А вот код C#:

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using Xamarin.Forms;

namespace FlowersStore
{
    public class Zoo
    {
        public string ImageUrl { get; set; }
        public string Name { get; set; }
    }

    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
            LoadDataCatouselView();            
        }

        public void LoadDataCatouselView()
        {
            ObservableCollection<Zoo> Zoos = new ObservableCollection<Zoo>
        {
            new Zoo
            {
                ImageUrl = "http://content.screencast.com/users/JamesMontemagno/folders/Jing/media/23c1dd13-333a-459e-9e23-c3784e7cb434/2016-06-02_1049.png",
                Name = "Woodland Park Zoo"
            },
                new Zoo
            {
                ImageUrl =    "http://content.screencast.com/users/JamesMontemagno/folders/Jing/media/6b60d27e-c1ec-4fe6-bebe-7386d545bb62/2016-06-02_1051.png",
                Name = "Cleveland Zoo"
                },
            new Zoo
            {
                ImageUrl = "http://content.screencast.com/users/JamesMontemagno/folders/Jing/media/e8179889-8189-4acb-bac5-812611199a03/2016-06-02_1053.png",
                Name = "Phoenix Zoo"
            }
        };
            CarouselZoos.ItemsSource = Zoos;
        }

    }
}

Я использую Xamarin Live Player для отладки. В журнале мобильного телефона отображается следующее сообщение: [LogEntry: Time = 19.11.2018 14:54:54 +03: 00, Уровень = Ошибка, Заголовок = Ошибка визуализации, Сообщение = Данный ключ отсутствует в словаре. (KeyNotFoundException)]

Как это исправить? Спасибо.

Обновление 1: Я заменил код по вашему совету. Я воспользовался твоим советом. Я пробовал запустить приложение на:

  1. Версия Androind: 7.1
  2. Эмулятор: Genymotion Galaxy S7 7.1.0 API 25

И получил эту ошибку: CarouselView в XamarinForms

Что это? :(

Вы пробовали на симуляторе или на физическом устройстве?

hashimks 19.11.2018 13:23

Это проблема с путем, я экспериментировал, что в одном случае я перемещаю все решение проекта на мой локальный диск C: \ Я думаю, это проблема с компиляцией.

Ivan-San 19.11.2018 21:44

@hashimks - физическое устройство.

Range 19.11.2018 23:30

@ Иван-Сан Да! Да - да - да! Эта программа запущена! Большое спасибо! Можете написать как ответ :)

Range 19.11.2018 23:31
Стоит ли изучать PHP в 2026-2027 годах?
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
0
4
744
4
Перейти к ответу Данный вопрос помечен как решенный

Ответы 4

Добавьте BindingContext = this; после InitializeComponent (); или добавьте CarouselZoos.ItemsSource = Zoos; в методе OnAppearing ()

В вашем XAML у вас есть следующая строка:

<cv:CarouselView ItemsSource = "{Binding Zoos}" x:Name = "CarouselZoos">

Это означает, что код пытается связать имущество с именем Zoos со свойством ItemsSourceCarouselView. Вам нужно будет создать свойство типа List<View> и реализовать структуру INotifyPropertyChanged для обновления представления. Вам также необходимо назначить BindingContext страницы содержимого самому себе (BindingContext = this;).

Вы также можете обнаружить, что вы не можете просто привязать URL-адрес к источнику изображения и ожидать, что изображение появится.

Проблема добавлена ​​в первом сообщении, см.

Range 19.11.2018 21:24

Попробуйте этот
Сначала добавьте этот класс для привязки свойств и реализуйте структуру INotifyPropertyChanged для обновления представления.

public class ViewModelBase : INotifyPropertyChanged
{

    string title = string.Empty;

    /// <summary>
    /// Gets or sets the title.
    /// </summary>
    /// <value>The title.</value>
    public string Title
    {
        get { return title; }
        set { SetProperty(ref title, value); }
    }

    string icon = string.Empty;

    /// <summary>
    /// Gets or sets the icon.
    /// </summary>
    /// <value>The icon.</value>
    public string Icon
    {
        get { return icon; }
        set { SetProperty(ref icon, value); }
    }

    bool isBusy;

    /// <summary>
    /// Gets or sets a value indicating whether this instance is busy.
    /// </summary>
    /// <value><c>true</c> if this instance is busy; otherwise, <c>false</c>.</value>
    public bool IsBusy
    {
        get { return isBusy; }
        set
        {
            SetProperty(ref isBusy, value);
        }
    }


    /// <summary>
    /// Sets the property.
    /// </summary>
    /// <returns><c>true</c>, if property was set, <c>false</c> otherwise.</returns>
    /// <param name = "backingStore">Backing store.</param>
    /// <param name = "value">Value.</param>
    /// <param name = "propertyName">Property name.</param>
    /// <param name = "onChanged">On changed.</param>
    /// <typeparam name = "T">The 1st type parameter.</typeparam>
    protected bool SetProperty<T>(
        ref T backingStore, T value,
        [CallerMemberName]string propertyName = "",
        Action onChanged = null)
    {
        if (EqualityComparer<T>.Default.Equals(backingStore, value))
            return false;

        backingStore = value;
        onChanged?.Invoke();
        OnPropertyChanged(propertyName);
        return true;
    }

    /// <summary>
    /// Occurs when property changed.
    /// </summary>
    public event PropertyChangedEventHandler PropertyChanged;
    /// <summary>
    /// Raises the property changed event.
    /// </summary>
    /// <param name = "propertyName">Property name.</param>
    protected void OnPropertyChanged([CallerMemberName]string propertyName = "") => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}

Теперь, когда у вас есть базовый класс для связывания свойств, вы можете добавить класс модели представления для связывания свойств и следовать шаблону MVVM. Я думаю, что это наиболее удобный способ манипулирования данными.

public class Zoo
{
    public string ImageUrl { get; set; }
    public string Name { get; set; }
}

public class CarouselViewModel : ViewModelBase
{
    private ObservableCollection<Zoo> zoos;
    public ObservableCollection<Zoo> Zoos
    {
        get => zoos; set => SetProperty(ref zoos, value);
    }

    public CarouselViewModel()
    {
        zoos = new ObservableCollection<Zoo>
        {
            new Zoo
            {
                ImageUrl = "http://content.screencast.com/users/JamesMontemagno/folders/Jing/media/23c1dd13-333a-459e-9e23-c3784e7cb434/2016-06-02_1049.png",
                Name = "Woodland Park Zoo"
            },
                new Zoo
            {
                ImageUrl =    "http://content.screencast.com/users/JamesMontemagno/folders/Jing/media/6b60d27e-c1ec-4fe6-bebe-7386d545bb62/2016-06-02_1051.png",
                Name = "Cleveland Zoo"
                },
            new Zoo
            {
                ImageUrl = "http://content.screencast.com/users/JamesMontemagno/folders/Jing/media/e8179889-8189-4acb-bac5-812611199a03/2016-06-02_1053.png",
                Name = "Phoenix Zoo"
            }
        };
    }
}
public partial class MainPage : ContentPage
{
    public CarouselViewModel viewModel;
    public MainPage()
    {
        InitializeComponent();
        this.BindingContext = viewModel = new CarouselViewModel();
    }
}

Я изменил код, как вы указали, но ошибка осталась прежней: (

Range 19.11.2018 17:54

Может, дело в Xamarin Live Player, пробовали собрать на телефоне или в симуляторе? Пробую на себе, работает без ошибок.

Ivan-San 19.11.2018 18:03

Пожалуйста, смотрите первый пост

Range 19.11.2018 21:23
Ответ принят как подходящий

Проблема в длинном пути. Простое решение - переместить все проектное решение на более короткий путь, например C: \

Вот объяснение от Microsoft: Путь слишком длинный, исключение

Другие вопросы по теме