Schermate di avvio per le app Xamarin.iOS

1. In Visual Studio per Mac creare un nuovo progetto selezionando File Nuova soluzione e quindi scegliendo App visualizzazione singola:>

   

   • Per impostazione predefinita, un nuovo progetto include un file LaunchScreen.storyboard che definisce l'interfaccia della schermata di avvio.
   • Per aggiungere invece uno storyboard della schermata di avvio a un progetto esistente, fare clic con il pulsante destro del mouse sul nome del progetto nel riquadro della soluzione e scegliere Aggiungi > nuovo file e quindi selezionare Schermata di avvio:

   

   • Assegnare al file il nome LaunchScreen o un altro nome scelto.

2. Configurare il progetto per usare lo storyboard appropriato per la schermata di avvio:

   • Fare doppio clic sul file Info.plist nel riquadro della soluzione per aprirlo per la modifica.
   • Nella sezione Launch Images (Avvia immagini) assicurarsi che Launch Screen (Schermata di avvio) sia impostato sul nome dello storyboard appropriato:

   

   • Per impostazione predefinita, un nuovo progetto è configurato per l'uso di LaunchScreen.storyboard come schermata di avvio.

3. Aggiungere un'immagine al catalogo asset Assets.xcassets in modo che sia disponibile per l'uso nella schermata di avvio. Per altre informazioni, vedere la sezione Aggiunta di immagini a un set di immagini del catalogo di asset della guida Visualizzazione di un'immagine .

4. Aprire LaunchScreen.storyboard per la modifica facendo doppio clic su di esso nel riquadro della soluzione.

5. Scegliere un dispositivo e l'orientamento su cui visualizzare in anteprima lo storyboard dello schermo di avvio in iOS Designer. Aprire il pannello di selezione del dispositivo sulla barra degli strumenti inferiore e selezionare i Telefono 4S e Verticale.

   

   • Si noti che la selezione di un dispositivo e dell'orientamento cambia solo la modalità di anteprima della progettazione di iOS Designer. Indipendentemente dalla selezione effettuata qui, i nuovi vincoli aggiunti vengono applicati in tutti i dispositivi e gli orientamenti, a meno che il pulsante Modifica tratti non sia stato usato per specificare diversamente.

6. Impostare il colore di sfondo della visualizzazione principale del controller di visualizzazione. Selezionare la visualizzazione facendo clic al centro del controller di visualizzazione e regolare il colore di sfondo usando il riquadro proprietà:

   

7. Aggiungere una visualizzazione immagine alla schermata di avvio e impostarne l'immagine di origine:

   • Trascinare una visualizzazione immagine dal riquadro della casella degli strumenti al centro della visualizzazione.
   • Con l'opzione Visualizzazione immagini selezionata, nella sezione Widget del riquadro proprietà impostare la proprietà Image sul set di immagini già aggiunto al Catalogo asset Assets.xcassets . Riposizionare e ridimensionare la visualizzazione immagini in base alle esigenze:

   

8. Aggiungere un'etichetta sotto la visualizzazione immagine e usare il riquadro proprietà per impostare i relativi attributi:

   

9. Passare alla modalità di modifica dei vincoli usando il pulsante destro della barra degli strumenti vincoli:

   

10. Aggiungere vincoli alla visualizzazione immagini, impostandone l'altezza e la larghezza e centrandola orizzontalmente e verticalmente:

    

    • Per altre informazioni su come aggiungere vincoli, vedere Layout automatico con Xamarin Designer per iOS.

11. Aggiungere vincoli all'etichetta, centrandolo orizzontalmente, assegnando un'altezza e una larghezza e posizionando una distanza fissa verticalmente dalla visualizzazione immagini:

    

12. Testare altri dispositivi e orientamenti per verificare che la progettazione abbia l'aspetto previsto in tutti gli scenari. Nei casi in cui è necessario apportare modifiche per un dispositivo o un orientamento specifico, usare il pulsante Modifica tratti per aggiungere vincoli per classi di dimensioni specifiche:

    

13. Salvare le modifiche apportate allo Storyboard. Eseguire l'app in un simulatore o un dispositivo e la schermata di avvio sarà visibile quando l'app viene avviata.

1. Creare un nuovo progetto. In Visual Studio selezionare File > New > Project > Visual C# > i Telefono & iPad > iOS App (Xamarin):

   

   Selezionare il modello App visualizzazione singola e quindi fare clic su OK:

   

2. Se nel Esplora soluzioni sono presenti risorse > LaunchScreen.xib, eliminarlo facendo clic con il pulsante destro del mouse sul file e scegliendo Elimina. Questo file verrà sostituito con uno Storyboard nel passaggio successivo.

3. Creare uno storyboard da usare come schermata di avvio. Nella Esplora soluzioni fare clic con il pulsante destro del mouse sul progetto e scegliere Aggiungi > nuovo elemento, seguito da Storyboard vuoto. Denominare questo storyboard LaunchScreen.storyboard e fare clic su Aggiungi:

   

4. Configurare il progetto per l'uso di LaunchScreen.storyboard come storyboard della schermata di avvio:

   • Fare doppio clic sul file Info.plist in Esplora soluzioni per aprirlo e modificarlo.
   • Nella scheda Asset visivi impostare Schermata di avvio su LaunchScreen.

   

5. Aggiungere un'immagine a un catalogo asset nel progetto in modo che sia disponibile per l'uso nella schermata di avvio:

   • Nel Esplora soluzioni fare clic con il pulsante destro del mouse su Cataloghi asset e scegliere Aggiungi catalogo asset. Denominare il nuovo asset del catalogo di asset:

   

   • Aggiungere un nuovo set di immagini al catalogo asset asset , come descritto nella sezione Aggiunta di immagini a un set di immagini del catalogo di asset della guida Alla visualizzazione di un'immagine .

6. Aprire LaunchScreen.storyboard per la modifica facendo doppio clic su di esso nel Esplora soluzioni.

   • Per modificare un file Storyboard, Visual Studio richiede una connessione attiva a un host di compilazione Mac. Per informazioni dettagliate, vedere la guida Connessione ing al Mac.

7. Scegliere un dispositivo e l'orientamento su cui visualizzare in anteprima lo storyboard dello schermo di avvio in iOS Designer. Aprire il pannello di selezione del dispositivo sulla barra degli strumenti inferiore e selezionare i Telefono 4S e Verticale:

   

   • Si noti che la selezione di un dispositivo e dell'orientamento cambia solo la modalità di anteprima della progettazione di iOS Designer. Indipendentemente dalla selezione effettuata qui, i nuovi vincoli aggiunti vengono applicati in tutti i dispositivi e gli orientamenti, a meno che il pulsante Modifica tratti non sia stato usato per specificare diversamente.

8. Aggiungere un controller di visualizzazione allo storyboard trascinandone uno dalla casella degli strumenti nell'area di progettazione:

   

9. Impostare il colore di sfondo della visualizzazione principale del controller di visualizzazione. Selezionare la visualizzazione facendo clic al centro del controller di visualizzazione e regolare il colore di sfondo usando la finestra Proprietà:

   

10. Aggiungere una visualizzazione immagine alla schermata di avvio e impostarne l'immagine di origine:

    • Trascinare una visualizzazione immagine dalla casella degli strumenti al centro della visualizzazione.
    • Con la visualizzazione immagini ancora selezionata, nella sezione Widget della finestra Proprietà impostare la proprietà Image sul set di immagini già aggiunto al Catalogo asset asset . Riposizionare e ridimensionare la visualizzazione immagini in base alle esigenze:

    

11. Aggiungere un'etichetta sotto la visualizzazione immagine:

    • Trascinare un'etichetta dalla casella degli strumenti nell'area di progettazione, posizionandola sotto la visualizzazione immagini.
    • Impostare gli attributi per l'etichetta usando la finestra Proprietà:

    

12. Passare alla modalità di modifica dei vincoli usando il pulsante destro della barra degli strumenti vincoli:

    

13. Aggiungere vincoli alla visualizzazione immagini, impostandone l'altezza e la larghezza e centrandola orizzontalmente e verticalmente:

    

    • Per informazioni sull'aggiunta di vincoli, vedere Layout automatico con Xamarin Designer per iOS.

14. Aggiungere vincoli all'etichetta, centrandolo orizzontalmente, assegnando un'altezza e una larghezza e posizionando una distanza fissa verticalmente dalla visualizzazione immagini:

    

15. Testare altri dispositivi e orientamenti per verificare che la progettazione abbia l'aspetto previsto in tutti gli scenari. Nei casi in cui è necessario apportare modifiche per un dispositivo o un orientamento specifico, usare il pulsante Modifica tratti per aggiungere vincoli per classi di dimensioni specifiche:

    

16. Salvare le modifiche apportate allo Storyboard. Eseguire l'app in un simulatore o un dispositivo e la schermata di avvio sarà visibile quando l'app viene avviata.

Quando si aggiorna un'app esistente per usare storyboard per le schermate di avvio, fare clic con il pulsante destro del mouse sul nome del progetto nella Esplora soluzioni e selezionare Aggiungi>nuovo file.... Selezionare schermata di avvio di iOS>e fare clic sul pulsante Nuovo:

Fare quindi doppio clic sul Info.plist file nel Esplora soluzioni per aprirlo per la modifica. In Schermata di avvio selezionare il nuovo file Storyboard creato in precedenza.

Per usare il nuovo storyboard come schermata di avvio, eseguire le operazioni seguenti:

1. Fare doppio clic sul Info.plist file nel Esplora soluzioni per aprirlo per la modifica.

2. Scorrere fino alla sezione Immagini di avvio universale dell'editor, aprire l'elenco a discesa Schermata di avvio e selezionare il nome dello storyboard creato in precedenza:

   

1. Fare clic con il pulsante destro del mouse sul nome del progetto nel Esplora soluzioni e scegliere Aggiungi>nuovo file...:

   

2. Immettere un nome per la schermata di avvio e fare clic sul pulsante Aggiungi :

   

3. Nella Esplora soluzioni fare doppio clic sul file dello storyboard appena creato per aprirlo per la modifica.

4. Verificare che la classe Size sia impostata su any:any e che View As sia Generico:

   

5. Assembly della schermata di avvio da Classi di dimensioni, semplici elementi dell'interfaccia utente (ad esempio UIImageView) e immagini inclusi nel bundle dell'applicazione:

   

6. Salvare le modifiche apportate allo Storyboard.