將 CarouselView 匯入 XAML 頁面

基礎

在 ContentPage 的標題中，插入以下行：

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

在<ContentPage.Content>標記之間放置 CarouselView：

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

x：Name 將為你的 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 設定為 DemoCarouselView 的 ItemSource

DemoCarouselView.ItemsSource = TechGiants;

DataTemplates

在 XAML 檔案中，為 CarouselView 提供一個 DataTemplate：

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

定義 DataTemplate。在這種情況下，這將是一個標籤，文字繫結到 itemsource 和綠色背景：

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

而已！ 執行程式，看看結果！