Xamarin.Forms
CarouselView - предварительная версия
Поиск…
замечания
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>
Это оно! Запустите программу и посмотрите результат!