Xamarin.Forms
CarouselView - Versión de prelanzamiento
Buscar..
Observaciones
CarouselView es un control de Xamarin que puede contener cualquier tipo de vista. Este control previo al lanzamiento solo se puede usar en proyectos de Xamarin Forms.
En el ejemplo proporcionado por James Montemagno , en el blog de Xamarin, CarouselView se usa para mostrar imágenes.
En este momento, CarouselView no está integrado en Xamarin.Forms. Para usar esto en su (s) proyecto (s), tendrá que agregar el paquete NuGet (vea el ejemplo anterior).
Importar CarouselView
La forma más sencilla de importar CarouselView es usar el Administrador de paquetes NuGet en Xamarin / Visual studio:
Para usar los paquetes de prelanzamiento, asegúrese de habilitar la casilla de verificación "Mostrar paquetes de prelanzamiento" en la esquina izquierda.
Cada subproyecto (.iOS / .droid ./. WinPhone) debe importar este paquete.
Importar CarouselView en una página XAML
Los basicos
En el encabezado de ContentPage, inserte la siguiente línea:
xmlns:cv="clr-namespace:Xamarin.Forms;assembly=Xamarin.Forms.CarouselView"
Entre las etiquetas <ContentPage.Content> coloca el CarouselView:
<cv:CarouselView x:Name="DemoCarouselView">
</cv:CarouselView>
x: Nombre le dará a CarouselView un nombre, que se puede usar en el código C # detrás del archivo. Esto es lo básico que debe hacer para integrar CarouselView en una vista. Los ejemplos dados no le mostrarán nada porque CarouselView está vacío.
Creando fuente enlazable
Como ejemplo de un ItemSource, usaré un ObservableCollection de cadenas.
public ObservableCollection<TechGiant> TechGiants { get; set; }
TechGiant es una clase que albergará nombres de Technology Giants.
public class TechGiant
{
public string Name { get; set; }
public TechGiant(string Name)
{
this.Name = Name;
}
}
Después del InitializeComponent de su página, cree y complete la colección Observable
TechGiants = new ObservableCollection<TechGiant>();
TechGiants.Add(new TechGiant("Xamarin"));
TechGiants.Add(new TechGiant("Microsoft"));
TechGiants.Add(new TechGiant("Apple"));
TechGiants.Add(new TechGiant("Google"));
Por fin, establezca a TechGiants para que sea la fuente de elementos de DemoCarouselView
DemoCarouselView.ItemsSource = TechGiants;
Plantillas de datos
En el archivo XAML, asigne a CarouselView una DataTemplate:
<cv:CarouselView.ItemTemplate>
</cv:CarouselView.ItemTemplate>
Definir una plantilla de datos. En este caso, se tratará de una etiqueta con un enlace de texto a la fuente de elementos y un fondo verde:
<DataTemplate>
<Label Text="{Binding Name}" BackgroundColor="Green"/>
</DataTemplate>
¡Eso es! Ejecuta el programa y ve el resultado!