Поиск…


замечания

CarouselView - это Xamarin Control, который может содержать любой вид View. Этот предварительный релиз можно использовать только в проектах Xamarin Forms.

В примере, представленном Джеймсом Монтеманьо , в блоге Xamarin, CarouselView используется для отображения изображений.

В настоящий момент CarouselView не интегрирован в Xamarin.Forms. Чтобы использовать это в своих проектах, вам нужно будет добавить пакет NuGet (см. Пример выше).

Импортировать CarouselView

Самый простой способ импортировать CarouselView - использовать диспетчер NuGet-Packages в студии Xamarin / Visual: введите описание изображения здесь

Чтобы использовать пакеты перед выпуском, установите флажок «Показывать пакеты перед выпуском» в левом углу.

Каждый подпроект (.iOS / .droid ./. WinPhone) должен импортировать этот пакет.

Импортировать CarouselView в страницу XAML

Основы

В заголовке ContentPage введите следующую строку:

xmlns:cv="clr-namespace:Xamarin.Forms;assembly=Xamarin.Forms.CarouselView"

Между тегами <ContentPage.Content> установите CarouselView:

<cv:CarouselView x:Name="DemoCarouselView">
</cv:CarouselView>

x: Имя даст вашему CarouselView имя, которое может использоваться в коде C # за файлом. Это основа, которую вам нужно сделать для интеграции CarouselView в представление. Приведенные примеры не покажут вам ничего, потому что CarouselView пуст.

Создание связующего источника

В качестве примера ItemSource я буду использовать ObservableCollection строк.

public ObservableCollection<TechGiant> TechGiants { get; set; }

TechGiant - это класс, в котором будут представлены имена Технологических гигантов

public class TechGiant
{
    public string Name { get; set; }

    public TechGiant(string Name)
    {
        this.Name = Name;
    }
}

После InitializeComponent вашей страницы создайте и заполните ObservableCollection

TechGiants = new ObservableCollection<TechGiant>();
TechGiants.Add(new TechGiant("Xamarin"));
TechGiants.Add(new TechGiant("Microsoft"));
TechGiants.Add(new TechGiant("Apple"));
TechGiants.Add(new TechGiant("Google"));

Наконец, установите TechGiants как ItemSource DemoCarouselView

DemoCarouselView.ItemsSource = TechGiants;

DataTemplates

В XAML-файле дайте CarouselView DataTemplate:

<cv:CarouselView.ItemTemplate>
</cv:CarouselView.ItemTemplate>

Определите DataTemplate. В этом случае это будет метка с привязкой текста к источнику элементов и зеленым фоном:

<DataTemplate>
    <Label Text="{Binding Name}" BackgroundColor="Green"/>
</DataTemplate>

Это оно! Запустите программу и посмотрите результат!



Modified text is an extract of the original Stack Overflow Documentation
Лицензировано согласно CC BY-SA 3.0
Не связан с Stack Overflow