File con estensione xib in Xamarin.Mac

Questo articolo illustra l'uso di file con estensione xib creati in Interface Builder di Xcode per creare e gestire interfacce utente per un'applicazione Xamarin.Mac.

Nota

Il modo migliore per creare un'interfaccia utente per un'app Xamarin.Mac è con storyboard. Questa documentazione è stata lasciata sul posto per motivi cronologici e per l'uso di progetti Xamarin.Mac meno recenti. Per altre informazioni, vedere la documentazione introduttiva agli storyboard .

Panoramica

Quando si lavora con C# e .NET in un'applicazione Xamarin.Mac, è possibile accedere agli stessi elementi e strumenti dell'interfaccia utente usati da uno sviluppatore in Objective-C e Xcode . Poiché Xamarin.Mac si integra direttamente con Xcode, è possibile usare Interface Builder di Xcode per creare e gestire le interfacce utente (o, facoltativamente, crearle direttamente nel codice C#).

Un file con estensione xib viene usato da macOS per definire elementi dell'interfaccia utente dell'applicazione (ad esempio Menu, Finestre, Visualizzazioni, Etichette, Campi di testo) creati e gestiti graficamente in Interface Builder di Xcode.

In questo articolo verranno illustrate le nozioni di base sull'uso dei file con estensione xib in un'applicazione Xamarin.Mac. È consigliabile iniziare a usare l'articolo Hello, Mac , perché illustra i concetti e le tecniche chiave che verranno usati in questo articolo.

È possibile esaminare anche la sezione Esposizione di classi/metodi C# al Objective-C documento Internals di Xamarin.Mac, che illustra gli Register attributi e Export usati per collegare le classi C# agli oggetti e agli Objective-C elementi dell'interfaccia utente.

Introduzione a Xcode e Interface Builder

Come parte di Xcode, Apple ha creato uno strumento denominato Interface Builder, che consente di creare visivamente l'interfaccia utente in una finestra di progettazione. Xamarin.Mac si integra in modo fluente con Interface Builder, consentendo di creare l'interfaccia utente con gli stessi strumenti che Objective-C gli utenti fanno.

Componenti di Xcode

Quando si apre un file con estensione xib in Xcode da Visual Studio per Mac, viene aperto con uno strumento di spostamento progetti a sinistra, l'editor di interfacce e gerarchia di interfaccia al centro e una sezione Proprietà e utilità a destra:

Verranno ora esaminate le operazioni di ognuna di queste sezioni Xcode e il modo in cui verranno usate per creare l'interfaccia per l'applicazione Xamarin.Mac.

Struttura di spostamento del progetto

Quando si apre un file con estensione xib per la modifica in Xcode, Visual Studio per Mac crea un file di progetto Xcode in background per comunicare le modifiche tra se stesso e Xcode. In seguito, quando si torna a Visual Studio per Mac da Xcode, tutte le modifiche apportate a questo progetto vengono sincronizzate con il progetto Xamarin.Mac Visual Studio per Mac.

La sezione Spostamento progetto consente di spostarsi tra tutti i file che costituiscono questo progetto Xcode shim . In genere, si sarà interessati solo ai file xib in questo elenco, ad esempio MainMenu.xib e MainWindow.xib.

Gerarchia dell'interfaccia

La sezione Gerarchia interfaccia consente di accedere facilmente a diverse proprietà chiave dell'interfaccia utente, ad esempio i segnaposto e la finestra principale. È anche possibile usare questa sezione per accedere ai singoli elementi (visualizzazioni) che costituiscono l'interfaccia utente e regolare il modo in cui vengono annidati trascinandoli all'interno della gerarchia.

Editor dell'interfaccia

La sezione Interface Editor (Editor interfaccia) fornisce la superficie in cui si layout graficamente l'interfaccia utente. Gli elementi verranno trascinati dalla sezione Libreria della sezione Proprietà e utilità per creare la progettazione. Quando si aggiungono elementi dell'interfaccia utente (visualizzazioni) all'area di progettazione, questi verranno aggiunti alla sezione Gerarchia di interfaccia nell'ordine in cui vengono visualizzati nell'editor dell'interfaccia.

Proprietà e utilità

La sezione Proprietà e utilità è suddivisa in due sezioni principali con cui si lavorerà, Proprietà (denominate anche Inspectors) e libreria:

Inizialmente questa sezione è quasi vuota, tuttavia se si seleziona un elemento nell'editor dell'interfaccia o nella gerarchia di interfaccia, la sezione Proprietà verrà popolata con informazioni sull'elemento e sulle proprietà specificate che è possibile modificare.

Nella sezione Properties (Proprietà) sono incluse 8 schede di controllo, come mostra la figura seguente:

Da sinistra a destra, queste schede sono:

• File Inspector (Controllo file): visualizza le informazioni sui file, ad esempio il nome file e il percorso del file Xib in fase di modifica.
• Quick Help (Guida rapida): questa scheda offre una guida contestuale in base all'elemento selezionato in Xcode.
• Identity Inspector (Controllo identità): offre informazioni sul comando o la visualizzazione selezionata.
• Controllo attributi: controllo attributi consente di personalizzare vari attributi del controllo/visualizzazione selezionato.
• Controllo dimensioni: controllo dimensioni consente di controllare le dimensioni e il comportamento di ridimensionamento del controllo/visualizzazione selezionato.
• Connessione ions Inspector : il controllo Connessione ions mostra le connessioni di uscita e azione dei controlli selezionati. Esamineremo outlet e azioni in un attimo.
• Controllo associazioni: il controllo associazioni consente di configurare i controlli in modo che i relativi valori vengano associati automaticamente ai modelli di dati.
• Controllo effetti visualizzazione: il controllo Effetti visualizzazione consente di specificare effetti sui controlli, ad esempio le animazioni.

Nella sezione Libreria è possibile trovare controlli e oggetti da inserire nella finestra di progettazione per compilare graficamente l'interfaccia utente:

Ora che si ha familiarità con l'IDE Xcode e Interface Builder, è possibile esaminarlo per creare un'interfaccia utente.

Creazione e gestione di finestre in Xcode

Il metodo preferito per la creazione di un'interfaccia utente di un'app Xamarin.Mac è con storyboard (vedere la documentazione introduzione agli storyboard per altre informazioni) e, di conseguenza, qualsiasi nuovo progetto avviato in Xamarin.Mac userà storyboard per impostazione predefinita.

Per passare all'uso di un'interfaccia utente basata su xib, eseguire le operazioni seguenti:

1. Aprire Visual Studio per Mac e avviare un nuovo progetto Xamarin.Mac.

2. Nel riquadro della soluzione fare clic con il pulsante destro del mouse sul progetto e scegliere Aggiungi>nuovo file...

3. Selezionare Controller Windows Mac>:

   

4. Immettere MainWindow per il nome e fare clic sul pulsante Nuovo :

   

5. Fare di nuovo clic con il pulsante destro del mouse sul progetto e scegliere Aggiungi>nuovo file...

6. Selezionare Il menu principale mac>:

   

7. Lasciare il nome e MainMenu fare clic sul pulsante Nuovo .

8. Nel riquadro della soluzione selezionare il file Main.storyboard, fare clic con il pulsante destro del mouse e scegliere Rimuovi:

   

9. Nella finestra di dialogo Rimuovi fare clic sul pulsante Elimina :

   

10. Nel riquadro della soluzione fare doppio clic sul file Info.plist per aprirlo per la modifica.

11. Selezionare MainMenu dall'elenco a discesa Interfaccia principale:

    

12. Nel riquadro della soluzione fare doppio clic sul file MainMenu.xib per aprirlo per la modifica in Interface Builder di Xcode.

13. In Controllo libreria digitare object nel campo di ricerca e quindi trascinare un nuovo oggetto nell'area di progettazione:

    

14. In Identity Inspector (Controllo identità) immettere AppDelegate per Class (Classe):

    

15. Selezionare Proprietario del file dalla gerarchia dell'interfaccia, passare al controllo Connessione ion e trascinare una riga dal delegato all'oggetto AppDelegate appena aggiunto al progetto:

    

16. Salvare le modifiche e tornare a Visual Studio per Mac.

Con tutte queste modifiche apportate, modificare il file AppDelegate.cs e renderlo simile al seguente:

using AppKit;
using Foundation;

namespace MacXib
{
    [Register ("AppDelegate")]
    public class AppDelegate : NSApplicationDelegate
    {
        public MainWindowController mainWindowController { get; set; }

        public AppDelegate ()
        {
        }

        public override void DidFinishLaunching (NSNotification notification)
        {
            // Insert code here to initialize your application
            mainWindowController = new MainWindowController ();
            mainWindowController.Window.MakeKeyAndOrderFront (this);
        }

        public override void WillTerminate (NSNotification notification)
        {
            // Insert code here to tear down your application
        }
    }
}

Ora la finestra principale dell'app è definita in un file con estensione xib incluso automaticamente nel progetto quando si aggiunge un controller di finestra. Per modificare la progettazione delle finestre, nel riquadro della soluzione fare doppio clic sul file MainWindow.xib:

Verrà aperta la progettazione della finestra in Interface Builder di Xcode:

Flusso di lavoro della finestra standard

Per qualsiasi finestra creata e operatore nell'applicazione Xamarin.Mac, il processo è fondamentalmente lo stesso:

1. Per le nuove finestre che non sono l'impostazione predefinita aggiunta automaticamente al progetto, aggiungere una nuova definizione di finestra al progetto.
2. Fare doppio clic sul file xib per aprire la progettazione della finestra per la modifica in Interface Builder di Xcode.
3. Impostare le proprietà della finestra necessarie in Controllo attributi e Controllo dimensioni.
4. Trascinare i controlli necessari per compilare l'interfaccia e configurarli in Controllo attributi.
5. Usare Controllo dimensioni per gestire il ridimensionamento per gli elementi dell'interfaccia utente.
6. Esporre gli elementi dell'interfaccia utente della finestra al codice C# tramite outlet e azioni.
7. Salvare le modifiche e tornare a Visual Studio per Mac per la sincronizzazione con Xcode.

Progettazione di un layout di finestra

Il processo di disposizione di un'interfaccia utente in Interface Builder è fondamentalmente lo stesso per ogni elemento aggiunto:

1. Trovare il controllo desiderato in Controllo libreria e trascinarlo nell'editor dell'interfaccia e posizionarlo.
2. Impostare le proprietà della finestra necessarie in Controllo attributi.
3. Usare Controllo dimensioni per gestire il ridimensionamento per gli elementi dell'interfaccia utente.
4. Se si usa una classe personalizzata, impostarla in Identity Inspector.
5. Esporre gli elementi dell'interfaccia utente al codice C# tramite outlet e azioni.
6. Salvare le modifiche e tornare a Visual Studio per Mac per la sincronizzazione con Xcode.

Ad esempio:

1. In Xcode trascinare Push Button (Pulsante Push) da Library Section (Sezione librerie):

   

2. Rilasciare il pulsante nella finestra nell'editor dell'interfaccia:

   

3. Fare clic sulla proprietà Title (Titolo) in Attribute Inspector (Controllo attributi) e modificare il titolo del pulsante in Click Me:

   

4. Trascinare Label (Etichetta) da Library Section (Sezione librerie):

   

5. Trascinare l'etichetta in Window (Finestra) accanto al pulsante in Interface Editor (Editor interfaccia):

   

6. Selezionare il quadratino a destra sull'etichetta e trascinarlo fino a quando non è vicino al bordo della finestra:

   

7. Con l'etichetta ancora selezionata nell'editor dell'interfaccia, passare a Controllo dimensioni:

   

8. Nella casella Ridimensionamento automatico fare clic sulla parentesi rossa dim a destra e sulla freccia orizzontale rossa dim al centro:

   

9. In questo modo l'etichetta si estenderà fino a crescere e ridursi man mano che la finestra viene ridimensionata nell'applicazione in esecuzione. Le parentesi rosse e la parte superiore e sinistra della casella Casella di ridimensionamento automatico indicano che l'etichetta deve essere bloccata nelle posizioni X e Y indicate.

10. Salvare le modifiche apportate all'interfaccia utente

Durante il ridimensionamento e lo spostamento dei controlli, si dovrebbe notare che Interface Builder fornisce suggerimenti utili per gli snap basati sulle linee guida dell'interfaccia umana os X. Queste linee guida consentono di creare applicazioni di alta qualità che avranno un aspetto familiare per gli utenti Mac.

Se si esamina la sezione Gerarchia di interfaccia, si noti come vengono visualizzati il layout e la gerarchia degli elementi che costituiscono l'interfaccia utente:

Da qui è possibile selezionare gli elementi da modificare o trascinare per riordinare gli elementi dell'interfaccia utente, se necessario. Ad esempio, se un elemento dell'interfaccia utente è coperto da un altro elemento, è possibile trascinarlo nella parte inferiore dell'elenco per renderlo l'elemento più in alto nella finestra.

Per altre informazioni sull'uso di Windows in un'applicazione Xamarin.Mac, vedere la documentazione di Windows .

Esposizione di elementi dell'interfaccia utente al codice C#

Dopo aver completato la disposizione dell'aspetto dell'interfaccia utente in Interface Builder, è necessario esporre gli elementi dell'interfaccia utente in modo che possano essere accessibili dal codice C#. A tale scopo, si useranno azioni e punti vendita.

Impostazione di un controller finestra principale personalizzato

Per poter creare outlet e azioni per esporre elementi dell'interfaccia utente al codice C#, l'app Xamarin.Mac dovrà usare un controller finestra personalizzato.

Effettua le operazioni seguenti:

1. Aprire lo storyboard dell'app in Interface Builder di Xcode.

2. Selezionare nell'area NSWindowController di progettazione.

3. Passare alla visualizzazione Identity Inspector e immettere WindowController come Nome classe:

   

4. Salvare le modifiche e tornare a Visual Studio per Mac da sincronizzare.

5. Un file WindowController.cs verrà aggiunto al progetto nel riquadro della soluzione in Visual Studio per Mac:

   

6. Riaprire lo storyboard in Interface Builder di Xcode.

7. Il file WindowController.h sarà disponibile per l'uso:

   

Outlet e azioni

Che cosa sono i punti vendita e le azioni? Nella programmazione tradizione dell'interfaccia utente .NET, i comandi dell'interfaccia utente vengono esposti automaticamente come proprietà quando vengono aggiunti. In Mac ciò non avviene, la semplice aggiunta di un comando in una visualizzazione non lo rende accessibile al codice. Lo sviluppatore deve esporre esplicitamente l'elemento dell'interfaccia utente al codice. Per eseguire questa operazione, Apple offre due opzioni:

• Outlet: gli outlet sono analoghi alle proprietà. Se si collega un controllo a un outlet, viene esposto al codice tramite una proprietà, in modo da poter eseguire operazioni come collegare gestori eventi, chiamare metodi su di esso e così via.
• Azioni: le azioni sono analoghe al modello di comando in WPF. Ad esempio, quando un'azione viene eseguita su un controllo, ad esempio un clic su un pulsante, il controllo chiamerà automaticamente un metodo nel codice. Le azioni sono potenti e convenienti perché è possibile collegare molti controlli alla stessa azione.

In Xcode, gli outlet e le azioni vengono aggiunti direttamente nel codice tramite il trascinamento del controllo. In particolare, ciò significa che per creare un punto di uscita o un'azione, scegli l'elemento di controllo che vuoi aggiungere una presa o un'azione, tieni premuto il pulsante Controllo sulla tastiera e trascina il controllo direttamente nel codice.

Per gli sviluppatori Xamarin.Mac, ciò significa che si trascinano nei Objective-C file stub che corrispondono al file C# in cui si vuole creare l'outlet o l'azione. Visual Studio per Mac creato un file denominato MainWindow.h come parte del progetto Xcode shim generato per usare Interface Builder:

Questo file stub .h esegue il mirror delle MainWindow.designer.cs aggiunte automaticamente a un progetto Xamarin.Mac quando viene creato un nuovo NSWindow file. Questo file verrà usato per sincronizzare le modifiche apportate da Interface Builder ed è la posizione in cui verranno creati punti di vendita e azioni in modo che gli elementi dell'interfaccia utente vengano esposti al codice C#.

Aggiunta di un punto di uscita

Con una conoscenza di base degli outlet e delle azioni, si esaminerà la creazione di un outlet per esporre un elemento dell'interfaccia utente al codice C#.

Effettua le operazioni seguenti:

1. In Xcode nell'angolo superiore destro della schermata fare clic sul pulsante Double Circle (Doppio cerchio) per aprire Assistant Editor (Editor assistente):

   

2. Xcode passa in una modalità di visualizzazione suddivisa con Interface Editor (Editor interfacce) da un lato e Code Editor (Editor codice) dall'altro.

3. Si noti che Xcode ha selezionato automaticamente il file MainWindowController.m nell'editor di codice, che non è corretto. Se ricordi dalla nostra discussione su quali outlet e azioni sono elencati sopra, dobbiamo selezionare MainWindow.h .

4. Nella parte superiore dell'editor del codice fare clic sul collegamento automatico e selezionare il file MainWindow.h:

   

5. Xcode dovrebbe ora avere il file selezionato corretto:

   

6. L'ultimo passaggio è molto importante. Se il file corretto non è selezionato, non sarà possibile creare outlet e azioni oppure verranno esposti alla classe errata in C#!

7. Nell'editor dell'interfaccia tenere premuto il tasto Di controllo sulla tastiera e trascinare l'etichetta creata sopra nell'editor di codice appena sotto il @interface MainWindow : NSWindow { } codice:

   

8. Viene visualizzata una finestra di dialogo. Lasciare l'Connessione impostata su outlet e immettere ClickedLabel per Nome:

   

9. Fare clic sul pulsante Connessione per creare l'outlet:

   

10. Salvare le modifiche apportate al file.

Aggiunta di un'azione

Si esaminerà ora la creazione di un'azione per esporre un'interazione dell'utente con l'elemento dell'interfaccia utente al codice C#.

Effettua le operazioni seguenti:

1. Assicurarsi di essere ancora presenti nell'Editor assistente e che il file MainWindow.h sia visibile nell'editor di codice.

2. Nell'editor dell'interfaccia tenere premuto il tasto Di controllo sulla tastiera e fare clic sul pulsante creato sopra nell'editor di codice appena sotto il @property (assign) IBOutlet NSTextField *ClickedLabel; codice:

   

3. Modificare il tipo di Connessione ion in azione:

   

4. Immettere ClickedButton in Name (Nome):

   

5. Fare clic sul pulsante Connessione per creare un'azione:

   

6. Salvare le modifiche apportate al file.

Con l'interfaccia utente cablata ed esposta al codice C#, tornare a Visual Studio per Mac e consentire la sincronizzazione delle modifiche da Xcode e Interface Builder.

Scrittura del codice

Con l'interfaccia utente creata e i relativi elementi dell'interfaccia utente esposti al codice tramite outlet e azioni, si è pronti a scrivere il codice per portare il programma alla vita. Ad esempio, aprire il file MainWindow.cs per la modifica facendo doppio clic su di esso nel riquadro della soluzione:

Aggiungere il codice seguente alla MainWindow classe per lavorare con l'outlet di esempio creato in precedenza:

private int numberOfTimesClicked = 0;
...

public override void AwakeFromNib ()
{
    base.AwakeFromNib ();

    // Set the initial value for the label
    ClickedLabel.StringValue = "Button has not been clicked yet.";
}

Si noti che l'oggetto NSLabel è accessibile in C# dal nome diretto assegnato in Xcode quando è stato creato il relativo outlet in Xcode, in questo caso viene chiamato ClickedLabel. È possibile accedere a qualsiasi metodo o proprietà dell'oggetto esposto allo stesso modo in cui si farebbe qualsiasi normale classe C#.

Importante

È necessario usare AwakeFromNib, anziché un altro metodo, ad Initializeesempio , perché AwakeFromNib viene chiamato dopo che il sistema operativo ha caricato e creato un'istanza dell'interfaccia utente dal file xib. Se si è tentato di accedere al controllo etichetta prima che il file xib sia stato completamente caricato e creato un'istanza, si riceverà un NullReferenceException errore perché il controllo etichetta non sarebbe ancora stato creato.

Aggiungere quindi la classe parziale seguente alla MainWindow classe :

partial void ClickedButton (Foundation.NSObject sender) {

    // Update counter and label
    ClickedLabel.StringValue = string.Format("The button has been clicked {0} time{1}.",++numberOfTimesClicked, (numberOfTimesClicked < 2) ? "" : "s");
}

Questo codice si collega all'azione creata in Xcode e Interface Builder e verrà chiamata ogni volta che l'utente fa clic sul pulsante.

Alcuni elementi dell'interfaccia utente hanno automaticamente azioni predefinite, ad esempio voci nella barra dei menu predefinita, ad esempio la voce di menu Apri... (openDocument:). Nel riquadro della soluzione fare doppio clic sul file AppDelegate.cs per aprirlo per la modifica e aggiungere il codice seguente sotto il DidFinishLaunching metodo :

[Export ("openDocument:")]
void OpenDialog (NSObject sender)
{
    var dlg = NSOpenPanel.OpenPanel;
    dlg.CanChooseFiles = false;
    dlg.CanChooseDirectories = true;

    if (dlg.RunModal () == 1) {
        var alert = new NSAlert () {
            AlertStyle = NSAlertStyle.Informational,
            InformativeText = "At this point we should do something with the folder that the user just selected in the Open File Dialog box...",
            MessageText = "Folder Selected"
        };
        alert.RunModal ();
    }
}

La riga chiave qui è [Export ("openDocument:")], che indica NSMenu che AppDelegate ha un metodo void OpenDialog (NSObject sender) che risponde all'azioneopenDocument:.

Per altre informazioni sull'uso dei menu, vedere la documentazione relativa ai menu .

Sincronizzazione delle modifiche con Xcode

Quando si torna a Visual Studio per Mac da Xcode, tutte le modifiche apportate in Xcode verranno sincronizzate automaticamente con il progetto Xamarin.Mac.

Se si seleziona il MainWindow.designer.cs nel riquadro della soluzione, sarà possibile vedere come l'uscita e l'azione sono state cablate nel codice C#:

Si noti come le due definizioni nel file MainWindow.designer.cs :

[Outlet]
AppKit.NSTextField ClickedLabel { get; set; }

[Action ("ClickedButton:")]
partial void ClickedButton (Foundation.NSObject sender);

Allineare le definizioni nel file MainWindow.h in Xcode:

@property (assign) IBOutlet NSTextField *ClickedLabel;
- (IBAction)ClickedButton:(id)sender;

Come si può notare, Visual Studio per Mac rimane in ascolto delle modifiche apportate al file h e quindi sincronizza automaticamente tali modifiche nel rispettivo file .designer.cs per esporle all'applicazione. È anche possibile notare che MainWindow.designer.cs è una classe parziale, in modo che Visual Studio per Mac non sia necessario modificare MainWindow.cs che sovrascrive le modifiche apportate alla classe.

Normalmente non avrai mai bisogno di aprire il MainWindow.designer.cs te stesso, è stato presentato qui solo a scopo educativo.

Importante

Nella maggior parte dei casi, Visual Studio per Mac visualizzerà automaticamente le modifiche apportate in Xcode e le sincronizza con il progetto Xamarin.Mac. Se la sincronizzazione non viene eseguita automaticamente, tornare a Xcode e quindi di nuovo in Visual Studio per Mac. Questa operazione avvia solitamente un ciclo di sincronizzazione.

Aggiunta di una nuova finestra a un progetto

A parte la finestra del documento principale, potrebbe essere necessario che un'applicazione Xamarin.Mac visualizzi altri tipi di finestre all'utente, ad esempio Preferenze o Pannelli di controllo. Quando si aggiunge una nuova finestra al progetto, è consigliabile usare sempre l'opzione Cocoa Window with Controller , in modo da semplificare il processo di caricamento della finestra dal file xib.

Per aggiungere una nuova finestra, eseguire le operazioni seguenti:

1. Nel riquadro della soluzione fare clic con il pulsante destro del mouse sul progetto e scegliere Aggiungi>nuovo file...

2. Nella finestra di dialogo Nuovo file selezionare Xamarin.Mac Cocoa Window with Controller (Finestra cocoa Xamarin.Mac>con controller):

   

3. Immettere PreferencesWindow in Nome e fare clic sul pulsante Nuovo.

4. Fare doppio clic sul file PreferencesWindow.xib per aprirlo per la modifica in Interface Builder:

   

5. Progettare l'interfaccia:

   

6. Salvare le modifiche e tornare a Visual Studio per Mac per la sincronizzazione con Xcode.

Aggiungere il codice seguente a AppDelegate.cs per visualizzare la nuova finestra:

[Export("applicationPreferences:")]
void ShowPreferences (NSObject sender)
{
    var preferences = new PreferencesWindowController ();
    preferences.Window.MakeKeyAndOrderFront (this);
}

La var preferences = new PreferencesWindowController (); riga crea una nuova istanza del controller finestra che carica la finestra dal file xib e lo gonfia. La preferences.Window.MakeKeyAndOrderFront (this); riga visualizza la nuova finestra all'utente.

Se si esegue il codice e si seleziona Preferenze dalmenu Applicazione, verrà visualizzata la finestra:

Per altre informazioni sull'uso di Windows in un'applicazione Xamarin.Mac, vedere la documentazione di Windows .

Aggiunta di una nuova visualizzazione a un progetto

In alcuni casi è più facile suddividere la progettazione della finestra in diversi file con estensione xib gestibili. Ad esempio, come disattivare il contenuto della finestra principale quando si seleziona un elemento della barra degli strumenti in una finestra Preferenze o si scambia il contenuto in risposta a una selezione elenco di origine .

Quando si aggiunge una nuova visualizzazione al progetto, è consigliabile usare sempre l'opzione Cocoa View with Controller , in modo da semplificare il processo di caricamento della vista dal file xib.

Per aggiungere una nuova visualizzazione, eseguire le operazioni seguenti:

1. Nel riquadro della soluzione fare clic con il pulsante destro del mouse sul progetto e scegliere Aggiungi>nuovo file...

2. Nella finestra di dialogo Nuovo file selezionare Xamarin.Mac>Cocoa View con controller:

   

3. Immettere SubviewTable in Nome e fare clic sul pulsante Nuovo.

4. Fare doppio clic sul file SubviewTable.xib per aprirlo per la modifica in Interface Builder e progettare l'interfaccia utente:

   

5. Collegare eventuali azioni e punti vendita necessari.

6. Salvare le modifiche e tornare a Visual Studio per Mac per la sincronizzazione con Xcode.

Modificare quindi il SubviewTable.cs e aggiungere il codice seguente al file AwakeFromNib per popolare la nuova visualizzazione quando viene caricata:

public override void AwakeFromNib ()
{
    base.AwakeFromNib ();

    // Create the Product Table Data Source and populate it
    var DataSource = new ProductTableDataSource ();
    DataSource.Products.Add (new Product ("Xamarin.iOS", "Allows you to develop native iOS Applications in C#"));
    DataSource.Products.Add (new Product ("Xamarin.Android", "Allows you to develop native Android Applications in C#"));
    DataSource.Products.Add (new Product ("Xamarin.Mac", "Allows you to develop Mac native Applications in C#"));
    DataSource.Sort ("Title", true);

    // Populate the Product Table
    ProductTable.DataSource = DataSource;
    ProductTable.Delegate = new ProductTableDelegate (DataSource);

    // Auto select the first row
    ProductTable.SelectRow (0, false);
}

Aggiungere un'enumerazione al progetto per tenere traccia della visualizzazione attualmente in corso. Ad esempio, SubviewType.cs:

public enum SubviewType
{
    None,
    TableView,
    OutlineView,
    ImageView
}

Modificare il file xib della finestra che utilizza la visualizzazione e visualizzarlo. Aggiungere una visualizzazione personalizzata che fungerà da contenitore per la visualizzazione dopo che viene caricata in memoria dal codice C# ed esporla a un outlet denominato ViewContainer:

Salvare le modifiche e tornare a Visual Studio per Mac per la sincronizzazione con Xcode.

Modificare quindi il file .cs della finestra che visualizzerà la nuova visualizzazione (ad esempio, MainWindow.cs) e aggiungere il codice seguente:

private SubviewType ViewType = SubviewType.None;
private NSViewController SubviewController = null;
private NSView Subview = null;
...

private void DisplaySubview(NSViewController controller, SubviewType type) {

    // Is this view already displayed?
    if (ViewType == type) return;

    // Is there a view already being displayed?
    if (Subview != null) {
        // Yes, remove it from the view
        Subview.RemoveFromSuperview ();

        // Release memory
        Subview = null;
        SubviewController = null;
    }

    // Save values
    ViewType = type;
    SubviewController = controller;
    Subview = controller.View;

    // Define frame and display
    Subview.Frame = new CGRect (0, 0, ViewContainer.Frame.Width, ViewContainer.Frame.Height);
    ViewContainer.AddSubview (Subview);
}

Quando è necessario visualizzare una nuova visualizzazione caricata da un file con estensione xib nel contenitore della finestra (visualizzazione personalizzata aggiunta in precedenza), questo codice gestisce la rimozione di qualsiasi visualizzazione esistente e lo scambio per quello nuovo. Sembra che tu abbia già una visualizzazione visualizzata, se così lo rimuove dalla schermata. Successivamente, accetta la visualizzazione passata (come caricato da un controller di visualizzazione) lo ridimensiona in modo che si adatti all'area contenuto e lo aggiunge al contenuto per la visualizzazione.

Per visualizzare una nuova visualizzazione, usare il codice seguente:

DisplaySubview(new SubviewTableController(), SubviewType.TableView);

In questo modo viene creata una nuova istanza del controller di visualizzazione per la nuova visualizzazione da visualizzare, ne imposta il tipo (come specificato dall'enumerazione aggiunta al progetto) e usa il DisplaySubview metodo aggiunto alla classe Window per visualizzare effettivamente la visualizzazione. Ad esempio:

Per altre informazioni sull'uso di Windows in un'applicazione Xamarin.Mac, vedere la documentazione di Windows e Dialogs .

Riepilogo

Questo articolo ha esaminato in dettaglio l'uso dei file con estensione xib in un'applicazione Xamarin.Mac. Sono stati illustrati i diversi tipi e usi dei file xib per creare l'interfaccia utente dell'applicazione, come creare e gestire file xib in Interface Builder di Xcode e come usare i file xib nel codice C#.

Collegamenti correlati

• MacImages (sample) (MacImages - Esempio)
• Hello, Mac
• Windows
• Menu
• Finestre di dialogo
• Uso delle immagini
• Linee guida dell'interfaccia umana macOS