All'avvio di una Windows Store app abbiamo la possibilità di mostrare un'immagine come splash screen. Questa viene mostrata il tempo necessario per caricare l'applicazione ma è svincolata dalla logica della stessa. Quindi ci troveremo l'applicazione in esecuzione, ma priva di dati, e quindi non utilizzabile dall'utente.
Intervenendo sul flusso d'esecuzione all'avvio dell'applicazione e utilizzando la classe SplashScreen possiamo mantenere l'immagine visualizzata e mostrare un'animazione di caricamento fin quando l'applicazione non avrà recuperato i dati necessari al suo funzionamento.
Per prima cosa aggiungiamo alla solution del nostro progetto un nuovo UserControl, e modifichiamo lo XAML come nell'esempio seguente.
<UserControl.Resources> <Storyboard x:Name="EnterLoadingStoryBoard"> <DoubleAnimation Duration="0:0:0.6" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ProgressRing" d:IsOptimized="True" /> <DoubleAnimation Duration="0:0:0.6" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateY)" Storyboard.TargetName="ProgressRing" d:IsOptimized="True" /> </Storyboard> </UserControl.Resources> <Canvas Background="#FF6600"> <Image x:Name="logoImage" Source="Assets/SplashScreen.png" Stretch="None" Width="620" Height="300" /> <ProgressRing x:Name="ProgressRing" Height="80" Width="80" IsActive="True" Foreground="Black" Opacity="0" RenderTransformOrigin="0.5,0.5"> <ProgressRing.RenderTransform> <CompositeTransform TranslateY="20" /> </ProgressRing.RenderTransform> </ProgressRing> </Canvas>
L'interfaccia dello UserControl è estremamente semplice, è composta dall'immagine utilizzata come splash screen e da un ProgressRing, in più abbiamo aggiunto una semplice animazione per rendere l'entrata della ProgressRing più piacevole.
E' il momento di modificare il flusso d'esecuzione. Apriamo il file App.xaml.cs e identifichiamo il metodo OnLaunched modificandolo come segue.
protected override void OnLaunched(LaunchActivatedEventArgs args) { if (args.PreviousExecutionState != ApplicationExecutionState.Running) { Window.Current.Content = new PreloadSplashScreen(args.SplashScreen); } Window.Current.Activate(); }
Il metodo OnLaunch riceve come parametro un'istanza dell'oggetto LaunchActivatedEventArgs, a noi interessa la proprietà del tipo SplashScreen, che useremo per inizializzare una nuova istanza dello UserControl aggiunto in precedenza al progetto. L'istanza così ottenuta viene impostata come contenuto della Window corrente e resa attiva.
Torniamo all'UserControl e modifichiamo il costruttore nel code behind come segue.
public PreloadSplashScreen(SplashScreen splashScreen) : this() { splashScreen.Dismissed += splashScreen_Dismissed; Canvas.SetLeft(this.logoImage, splashScreen.ImageLocation.Left); Canvas.SetTop(this.logoImage, splashScreen.ImageLocation.Top); Canvas.SetLeft(this.ProgressRing, splashScreen.ImageLocation.Left + logoImage.Width / 2 - ProgressRing.Width / 2); Canvas.SetTop(this.ProgressRing, splashScreen.ImageLocation.Bottom); //Inizio il caricamento delle risorse PreLoadData(); }
Nel costruttore come prima cosa ci registriamo all'evento Dismissed, così da poter gestire la chiusura della splash. Proseguiamo posizionando l'immagine della splash contenuta nell'UserControl esattamente dove era posizionata quella all'avvio dell'applicazione. Questa operazione può essere compiuta comodamente utilizzando la proprietà ImageLocation del tipo Rect.
Posizionare esattamente la splash screen consente di non notare la transizione dall'immagine usata all'avvio a quella presente nell'UserControl.
Una volta terminato il posizionamento degli elementi dell'UI iniziamo il caricamento dei dati richiamando il metodo PreLoadData.
private async void PreLoadData() { //Simulo operazioni lunghe await Task.Delay(2500); //Creo un nuovo frame var rootFrame = new Frame(); //Navigo rootFrame.Navigate(typeof(MainPage)); //Imposto il contenuto corrente dell'applicazione Window.Current.Content = rootFrame; }
Trattandosi di una demo, simuliamo l'attesa dovuta alle chiamate remote e quanto altro necessario a popolare di dati l'applicazione, mediante il metodo Task.Delay(2500). Successivamente creiamo una nuova istanza dell'oggetto Frame e navighiamo alla home. Infine impostiamo il frame come contenuto della Window.
Diamo un ultimo tocco eseguendo nell'event handler splashScreen_Dismissed l'animazione d'entrata creata per la ProgressRing.
void splashScreen_Dismissed(Windows.ApplicationModel.Activation.SplashScreen sender, object args) { this.Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, ((Storyboard)Resources["EnterLoadingStoryBoard"]).Begin); }
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Migliorare i tempi di risposta di GPT tramite lo streaming endpoint in ASP.NET Core
Utilizzare i primary constructor di C# per inizializzare le proprietà
Gestione dei nomi con le regole @layer in CSS
Gestione dell'annidamento delle regole dei layer in CSS
Implementare l'infinite scroll con QuickGrid in Blazor Server
Filtrare i dati di una QuickGrid in Blazor con una drop down list
Generare HTML a runtime a partire da un componente Razor in ASP.NET Core
Gestione degli stili CSS con le regole @layer
Utilizzare il metodo CountBy di LINQ per semplificare raggruppamenti e i conteggi
Supportare lo HierarchyID di Sql Server in Entity Framework 8
Esporre i propri servizi applicativi con Semantic Kernel e ASP.NET Web API
Recuperare l'ultima versione di una release di GitHub