Xamarin.Forms
CarouselView - Versione pre-release

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

Osservazioni

CarouselView è un controllo Xamarin che può contenere qualsiasi tipo di vista. Questo controllo preliminare può essere utilizzato solo nei progetti Xamarin Forms.

Nell'esempio fornito da James Montemagno , sul blog di Xamarin, CarouselView viene utilizzato per visualizzare le immagini.

In questo momento CarouselView non è integrato in Xamarin.Forms. Per utilizzarlo nei tuoi progetti, dovrai aggiungere il pacchetto NuGet (vedi esempio sopra).

Importa CarouselView

Il modo più semplice per importare CarouselView è utilizzare il Gestore di pacchetti NuGet in Xamarin / Visual Studio:

Per utilizzare i pacchetti di pre-rilascio, assicurati di abilitare la casella di controllo "Mostra pacchetti di rilascio preliminare" nell'angolo sinistro.

Ogni sottoprogetto (.iOS / .droid ./. WinPhone) deve importare questo pacchetto.

Importa CarouselView in una pagina XAML

Le basi

Nell'intestazione di ContentPage, inserisci la seguente riga:

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

Tra i tag <ContentPage.Content> posiziona CarouselView:

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

x: Name darà a CarouselView un nome che può essere usato nel codice C # dietro il file. Questa è la base che devi fare per integrare CarouselView in una vista. Gli esempi forniti non ti mostreranno nulla perché CarouselView è vuoto.

Creazione di origine bindable

Come esempio di ItemSource, userò una ObservableCollection di stringhe.

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

TechGiant è una classe che ospiterà nomi di Giganti della tecnologia

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

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

Dopo InitializeComponent della tua pagina, crea e riempie 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"));

Alla fine, imposta TechGiants come ItemSource di DemoCarouselView

DemoCarouselView.ItemsSource = TechGiants;

DataTemplates

Nel file XAML, assegnare a CarouselView un DataTemplate:

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

Definire un DataTemplate. In questo caso, si tratterà di un'etichetta con il bind di testo sull'origine articoli e uno sfondo verde:

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

Questo è tutto! Esegui il programma e guarda il risultato!

Modified text is an extract of the original Stack Overflow Documentation

Autorizzato sotto CC BY-SA 3.0

Non affiliato con Stack Overflow