Xamarin.Forms
CarouselView - wersja przedpremierowa

.NET Framework Android ASP.NET C# Language F# firebase iOS uwp wpf Xamarin.iOS

Uwagi

CarouselView to formant Xamarin, który może zawierać dowolny widok. Ta kontrola przedpremierowa może być używana tylko w projektach Xamarin Forms.

W przykładzie podanym przez Jamesa Montemagno na blogu Xamarin CarouselView służy do wyświetlania obrazów.

W tej chwili CarouselView nie jest zintegrowany z Xamarin.Forms. Aby użyć tego w swoich projektach, musisz dodać pakiet NuGet (patrz przykład powyżej).

Importuj CarouselView

Najprostszym sposobem na zaimportowanie CarouselView jest użycie NuGet-Packages Manager w Xamarin / Visual studio:

Aby korzystać z pakietów przedpremierowych, zaznacz pole wyboru „Pokaż pakiety przedpremierowe” w lewym rogu.

Każdy podprojekt (.iOS / .droid ./. WinPhone) musi zaimportować ten pakiet.

Zaimportuj CarouselView na stronę XAML

Podstawy

W nagłówku ContentPage wstaw następujący wiersz:

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

Pomiędzy tagami <ContentPage.Content> umieść CarouselView:

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

x: Nazwa nadaje CarouselView nazwę, której można użyć w kodzie C # za plikiem. To są podstawy, które musisz zrobić, aby zintegrować CarouselView z widokiem. Podane przykłady nic nie pokażą, ponieważ CarouselView jest pusty.

Tworzenie źródła wiążącego

Jako przykład ItemSource użyję ObservableCollection ciągów.

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

TechGiant to klasa, która będzie gościć nazwy gigantów technologicznych

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

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

Po InitializeComponent swojej strony utwórz i wypełnij 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"));

W końcu ustaw TechGiant na ItemSource w DemoCarouselView

DemoCarouselView.ItemsSource = TechGiants;

DataTemplates

W pliku XAML podaj CarouselView DataTemplate:

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

Zdefiniuj DataTemplate. W tym przypadku będzie to Etykieta z tekstem powiązanym ze źródłem przedmiotów i zielonym tłem:

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

Otóż to! Uruchom program i zobacz wynik!

Modified text is an extract of the original Stack Overflow Documentation

Licencjonowany na podstawie CC BY-SA 3.0

Nie związany z Stack Overflow