Con il rilascio di Xamarin.Forms 4.3, insieme all'ufficializzazione delle CollectionView, descritte negli script precedenti, troviamo la possibilità di avere in preview un nuovo elemento: la CarouselView.
Si può dire che è uno degli elementi che mancava all'interno dell'ecosistema Xamarin: i carousel (caroselli o slideshow), sono elementi molto usati soprattutto in ambito web e, con la release 4.3 di Xamarin Forms, hanno fatto il loro ingresso anche nella piattaforma di riferimento per i progetti cross-platform.
I carousel, insieme agli attributi visual, segnano un avvicinamento di Xamarin verso gli standard UI/UX web, portando le applicazioni native ad avere un'interfaccia omogenea su tutti i device, contrariamente a quanto è accaduto finora, dove un bottone aveva una UI caratteristica del sistema Android, se l'applicazione veniva eseguita su Android, e un design iOS, se eseguita su di un iPhone.
Ricordando che questa funzionalità è ancora in preview, nel momento della scrittura di questo articolo, alcune sue caratteristiche potrebbero variare nel tempo. Per poter utilizzarla già da ora sarà necessario aggiungere la riga seguente all'interno della MainActivity di Android o nell'AppDelegate di iOS:
Forms.SetFlags("CarouselView_Experimental");
Come tutti gli elementi di tipo lista all'interno di Xamarin, anche la CarouselView rispetta la struttura standard a cui siamo abituati:
- ItemsSource: fonte dati
- ItemTemplate: UI/UX
- attributo CurrentItemChanged: cambiamento della slide
Possiamo già abbozzare un primo esempio di CarouselView utilizzando solo le nostre conoscenze pregresse:
<CarouselView ItemsSource="{Binding MyList}" CurrentItemChanged="OnCurrentItemChanged"> <CarouselView.ItemTemplate> <DataTemplate> <StackLayout> <Label Text="{Binding Name}" HorizontalOptions="Center" VerticalOptions="Center" /> </StackLayout> </DataTemplate> <CarouselView.ItemTemplate> </CarouselView>
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Utilizzare database e servizi con gli add-on di Container App
Effettuare il binding di date in Blazor
3 metodi JavaScript che ogni applicazione web dovrebbe contenere - Parte 2
Usare lo spread operator con i collection initializer in C#
Effettuare update massivi con Entity Framework Core 7
Eseguire operazioni con timeout in React
Gestire domini wildcard in Azure Container Apps
Configurare policy CORS in Azure Container Apps
Modificare i metadati nell'head dell'HTML di una Blazor Web App
Effettuare delete massive con Entity Framework Core 7
Usare il versioning con i controller di ASP.NET Core Web API
Potenziare Azure AI Search con la ricerca vettoriale