Condividi tramite


Visualizzazioni struttura in Xamarin.Mac

Questo articolo illustra l'uso delle visualizzazioni struttura in un'applicazione Xamarin.Mac. Descrive la creazione e la gestione delle visualizzazioni struttura in Xcode e Interface Builder e l'uso a livello di codice.

Quando si lavora con C# e .NET in un'applicazione Xamarin.Mac, è possibile accedere alle stesse visualizzazioni struttura in cui uno sviluppatore lavora Objective-C e Xcode . Poiché Xamarin.Mac si integra direttamente con Xcode, è possibile usare Interface Builder di Xcode per creare e gestire le visualizzazioni struttura (o, facoltativamente, crearle direttamente nel codice C#).

Una visualizzazione struttura è un tipo di tabella che consente all'utente di espandere o comprimere righe di dati gerarchici. Analogamente a una visualizzazione tabella, una visualizzazione Struttura visualizza i dati per un set di elementi correlati, con righe che rappresentano singoli elementi e colonne che rappresentano gli attributi di tali elementi. A differenza di una visualizzazione tabella, gli elementi in una visualizzazione struttura non sono inclusi in un elenco semplice, sono organizzati in una gerarchia, ad esempio file e cartelle su un disco rigido.

Esecuzione di un'app di esempio

In questo articolo verranno illustrate le nozioni di base sull'uso delle visualizzazioni struttura in un'applicazione Xamarin.Mac. È consigliabile usare prima di tutto l'articolo Hello, Mac , in particolare le sezioni Introduzione a Xcode e Interface Builder e Outlet e Actions , in quanto 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-Cdocumento Internals di Xamarin.Mac, che illustra anche i Register comandi e Export usati per collegare le classi C# agli oggetti e agli Objective-C elementi dell'interfaccia utente.

Introduzione alle visualizzazioni struttura

Una visualizzazione struttura è un tipo di tabella che consente all'utente di espandere o comprimere righe di dati gerarchici. Analogamente a una visualizzazione tabella, una visualizzazione Struttura visualizza i dati per un set di elementi correlati, con righe che rappresentano singoli elementi e colonne che rappresentano gli attributi di tali elementi. A differenza di una visualizzazione tabella, gli elementi in una visualizzazione struttura non sono inclusi in un elenco semplice, sono organizzati in una gerarchia, ad esempio file e cartelle su un disco rigido.

Se un elemento in una visualizzazione struttura contiene altri elementi, può essere espanso o compresso dall'utente. Un elemento espandibile visualizza un triangolo di divulgazione, che punta a destra quando l'elemento viene compresso e punta verso il basso quando l'elemento viene espanso. Facendo clic sul triangolo di divulgazione, l'elemento viene espanso o compresso.

La visualizzazione struttura (NSOutlineView) è una sottoclasse della vista tabella (NSTableView) e, di conseguenza, eredita gran parte del comportamento dalla relativa classe padre. Di conseguenza, molte operazioni supportate da una vista tabella, ad esempio la selezione di righe o colonne, il riposizionamento delle colonne trascinando intestazioni di colonna e così via, sono supportate anche da una visualizzazione struttura. Un'applicazione Xamarin.Mac ha il controllo di queste funzionalità e può configurare i parametri della visualizzazione struttura (nel codice o in Interface Builder) per consentire o impedire determinate operazioni.

Una visualizzazione struttura non archivia i propri dati, ma si basa su un'origine dati (NSOutlineViewDataSource) per fornire sia le righe che le colonne necessarie, in base alle esigenze.

Il comportamento di una visualizzazione struttura può essere personalizzato fornendo una sottoclasse del delegato visualizzazione struttura (NSOutlineViewDelegate) per supportare la gestione delle colonne Struttura, digitare per selezionare funzionalità, selezione di righe e modifica, rilevamento personalizzato e visualizzazioni personalizzate per singole colonne e righe.

Poiché una visualizzazione struttura condivide gran parte del comportamento e delle funzionalità con una vista tabella, è consigliabile esaminare la documentazione delle visualizzazioni tabella prima di continuare con questo articolo.

Creazione e gestione di visualizzazioni struttura in Xcode

Quando si crea una nuova applicazione Xamarin.Mac Cocoa, si ottiene una finestra vuota standard per impostazione predefinita. Questa finestra viene definita in un .storyboard file incluso automaticamente nel progetto. Per modificare la progettazione delle finestre, nella Esplora soluzioni fare doppio clic sul Main.storyboard file:

Selezione dello storyboard principale

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

Modifica dell'interfaccia utente in Xcode

Digitare outline nella casella di ricerca di Controllo libreria per semplificare la ricerca dei controlli Visualizzazione struttura:

Selezione di una visualizzazione struttura dalla raccolta

Trascinare una visualizzazione struttura nel controller di visualizzazione nell'editor dell'interfaccia, renderla riempire l'area del contenuto del controller di visualizzazione e impostarla su dove si riduce e aumenta con la finestra nell'Editor vincoli:

Modifica dei vincoli

Selezionare la visualizzazione struttura nella gerarchia dell'interfaccia e le proprietà seguenti sono disponibili in Controllo attributi:

Screenshot che mostra le proprietà disponibili in Controllo attributi.

  • Colonna struttura: colonna di tabella in cui vengono visualizzati i dati gerarchici.
  • Salvataggio automatico colonna struttura: se true, la colonna struttura verrà salvata e ripristinata automaticamente tra le esecuzioni dell'applicazione.
  • Rientro : quantità di rientro delle colonne in un elemento espanso.
  • Il rientro segue le celle : se true, il rientro mark verrà rientrato insieme alle celle.
  • Salvataggio automatico di elementi espansi: se true, lo stato espanso/compresso degli elementi verrà salvato e ripristinato automaticamente tra le esecuzioni dell'applicazione.
  • Modalità contenuto: consente di usare visualizzazioni () o celle (NSViewNSCell) per visualizzare i dati nelle righe e nelle colonne. A partire da macOS 10.7, è consigliabile usare Views.
  • Floats Group Rows : se true, la vista tabella disegnare celle raggruppate come se fossero mobili.
  • Colonne : definisce il numero di colonne visualizzate.
  • Intestazioni : se true, le colonne avranno intestazioni.
  • Riordinamento : se true, l'utente sarà in grado di trascinare riordinare le colonne nella tabella.
  • Ridimensionamento : se true, l'utente sarà in grado di trascinare le intestazioni di colonna per ridimensionare le colonne.
  • Ridimensionamento delle colonne: controlla la modalità di ridimensionamento automatico delle colonne della tabella.
  • Evidenziazione : controlla il tipo di evidenziazione della tabella utilizzata quando viene selezionata una cella.
  • Righe alternative: se true, in qualsiasi altra riga sarà presente un colore di sfondo diverso.
  • Griglia orizzontale: seleziona il tipo di bordo disegnato tra le celle orizzontalmente.
  • Griglia verticale: seleziona il tipo di bordo disegnato tra le celle verticalmente.
  • Colore griglia: imposta il colore del bordo della cella.
  • Sfondo : imposta il colore di sfondo della cella.
  • Selezione : consente di controllare come l'utente può selezionare le celle nella tabella come:
    • Multiple : se true, l'utente può selezionare più righe e colonne.
    • Colonna: se true, l'utente può selezionare le colonne.
    • Digitare Select : se true, l'utente può digitare un carattere per selezionare una riga.
    • Vuoto : se true, l'utente non è necessario selezionare una riga o una colonna, la tabella non consente alcuna selezione.
  • Salvataggio automatico: nome in cui viene salvato automaticamente il formato delle tabelle.
  • Informazioni sulla colonna: se true, l'ordine e la larghezza delle colonne verranno salvati automaticamente.
  • Interruzioni di riga: consente di selezionare la modalità di gestione delle interruzioni di riga.
  • Tronca l'ultima riga visibile: se true, la cella verrà troncata nei dati non può essere inserita all'interno dei limiti.

Importante

A meno che non si gestisca un'applicazione Xamarin.Mac legacy, NSView è consigliabile usare le viste struttura basate sulle NSCell viste tabella basate. NSCell è considerato legacy e potrebbe non essere supportato in futuro.

Selezionare una colonna di tabella nella gerarchia dell'interfaccia e le proprietà seguenti sono disponibili in Controllo attributi:

Screenshot che mostra le proprietà disponibili per la colonna della tabella selezionata in Controllo attributi.

  • Titolo : imposta il titolo della colonna.
  • Allineamento : consente di impostare l'allineamento del testo all'interno delle celle.
  • Titolo Carattere : seleziona il tipo di carattere per il testo Intestazione della cella.
  • Chiave di ordinamento: chiave usata per ordinare i dati nella colonna. Lasciare vuoto se l'utente non è in grado di ordinare questa colonna.
  • Selettore: azione usata per eseguire l'ordinamento. Lasciare vuoto se l'utente non è in grado di ordinare questa colonna.
  • Order : ordinamento per i dati delle colonne.
  • Ridimensionamento : seleziona il tipo di ridimensionamento per la colonna.
  • Modificabile : se true, l'utente può modificare le celle in una tabella basata su cella.
  • Nascosto : se true, la colonna è nascosta.

È anche possibile ridimensionare la colonna trascinando il punto di manipolazione (centrato verticalmente sul lato destro della colonna) a sinistra o a destra.

Selezionare ogni colonna nella vista tabella e assegnare alla prima colonna un titolo e Product il secondo Details.

Selezionare una visualizzazione cella tabella (NSTableViewCell) nella gerarchia dell'interfaccia e le proprietà seguenti sono disponibili in Controllo attributi:

Screenshot che mostra le proprietà disponibili per la cella di tabella selezionata in Controllo attributi.

Queste sono tutte le proprietà di una visualizzazione standard. È anche possibile ridimensionare le righe per questa colonna qui.

Selezionare una cella di visualizzazione tabella (per impostazione predefinita, si tratta di ) NSTextFieldnella gerarchia di interfaccia e le proprietà seguenti sono disponibili in Controllo attributi:

Screenshot che mostra le proprietà disponibili per la cella di visualizzazione tabella selezionata in Controllo attributi.

Tutte le proprietà di un campo di testo standard verranno impostate qui. Per impostazione predefinita, viene usato un campo di testo standard per visualizzare i dati di una cella in una colonna.

Selezionare una visualizzazione cella tabella (NSTableFieldCell) nella gerarchia dell'interfaccia e le proprietà seguenti sono disponibili in Controllo attributi:

Screenshot che mostra le proprietà disponibili per la cella di visualizzazione tabella selezionata.

Di seguito sono riportate le impostazioni più importanti:

  • Layout : consente di selezionare la disposizione delle celle in questa colonna.
  • Usa la modalità riga singola: se true, la cella è limitata a una singola riga.
  • Prima larghezza layout runtime: se true, la cella preferisce il set di larghezza (manualmente o automaticamente) quando viene visualizzata la prima volta che viene eseguita l'applicazione.
  • Azione: controlla quando viene inviata l'azione di modifica per la cella.
  • Comportamento : definisce se una cella è selezionabile o modificabile.
  • Rtf: se true, la cella può visualizzare testo formattato e in stile.
  • Annulla: se true, la cella assume la responsabilità del comportamento di annullamento.

Selezionare la vista cella tabella (NSTableFieldCell) nella parte inferiore di una colonna tabella nella gerarchia dell'interfaccia:

Selezione della visualizzazione cella della tabella

In questo modo è possibile modificare la visualizzazione cella tabella usata come modello di base per tutte le celle create per la colonna specificata.

Aggiunta di azioni e punti di vendita

Proprio come qualsiasi altro controllo dell'interfaccia utente cocoa, è necessario esporre la visualizzazione struttura ed è una colonna e celle al codice C# usando Azioni e outlet (in base alle funzionalità necessarie).

Il processo è lo stesso per qualsiasi elemento Visualizzazione struttura che si vuole esporre:

  1. Passare all'Editor assistente e verificare che il ViewController.h file sia selezionato:

    Selezione del file con estensione h corretto

  2. Selezionare la visualizzazione struttura dalla gerarchia dell'interfaccia, fare clic sul controllo e trascinare nel ViewController.h file.

  3. Creare un outlet per la visualizzazione struttura denominata ProductOutline:

    Screenshot che mostra un outlet denominato ProductOutline in Controllo attributi.

  4. Creare outlet per le colonne delle tabelle denominate ProductColumn e DetailsColumn:

    Screenshot che mostra un outlet denominato DetailsColumn in Controllo attributi.

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

Successivamente, il codice visualizzerà alcuni dati per la struttura quando viene eseguita l'applicazione.

Popolamento della visualizzazione struttura

Con la visualizzazione struttura progettata in Interface Builder ed esposta tramite un outlet, è quindi necessario creare il codice C# per popolarlo.

Creare prima di tutto una nuova Product classe per contenere le informazioni per le singole righe e gruppi di prodotti secondari. Nella Esplora soluzioni fare clic con il pulsante destro del mouse sul progetto e scegliere Aggiungi>nuovo file... Selezionare General Empty Class (Classe vuota generale>), immettere Product per Name (Nome) e fare clic sul pulsante New (Nuovo):

Creazione di una classe vuota

Fare in modo che il Product.cs file sia simile al seguente:

using System;
using Foundation;
using System.Collections.Generic;

namespace MacOutlines
{
    public class Product : NSObject
    {
        #region Public Variables
        public List<Product> Products = new List<Product>();
        #endregion

        #region Computed Properties
        public string Title { get; set;} = "";
        public string Description { get; set;} = "";
        public bool IsProductGroup {
            get { return (Products.Count > 0); }
        }
        #endregion

        #region Constructors
        public Product ()
        {
        }

        public Product (string title, string description)
        {
            this.Title = title;
            this.Description = description;
        }
        #endregion
    }
}

Successivamente, è necessario creare una sottoclasse di NSOutlineDataSource per fornire i dati per la struttura come richiesto. Nella Esplora soluzioni fare clic con il pulsante destro del mouse sul progetto e scegliere Aggiungi>nuovo file... Selezionare General Empty Class (Classe vuota Generale>), immettere ProductOutlineDataSource per Name (Nome) e fare clic sul pulsante New (Nuovo).

Modificare il ProductTableDataSource.cs file e renderlo simile al seguente:

using System;
using AppKit;
using CoreGraphics;
using Foundation;
using System.Collections;
using System.Collections.Generic;

namespace MacOutlines
{
    public class ProductOutlineDataSource : NSOutlineViewDataSource
    {
        #region Public Variables
        public List<Product> Products = new List<Product>();
        #endregion

        #region Constructors
        public ProductOutlineDataSource ()
        {
        }
        #endregion

        #region Override Methods
        public override nint GetChildrenCount (NSOutlineView outlineView, NSObject item)
        {
            if (item == null) {
                return Products.Count;
            } else {
                return ((Product)item).Products.Count;
            }

        }

        public override NSObject GetChild (NSOutlineView outlineView, nint childIndex, NSObject item)
        {
            if (item == null) {
                return Products [childIndex];
            } else {
                return ((Product)item).Products [childIndex];
            }

        }

        public override bool ItemExpandable (NSOutlineView outlineView, NSObject item)
        {
            if (item == null) {
                return Products [0].IsProductGroup;
            } else {
                return ((Product)item).IsProductGroup;
            }

        }
        #endregion
    }
}

Questa classe dispone di spazio di archiviazione per gli elementi della visualizzazione struttura ed esegue l'override GetChildrenCount di per restituire il numero di righe nella tabella. Restituisce GetChild un elemento padre o figlio specifico (come richiesto dalla visualizzazione struttura) e definisce l'elemento ItemExpandable specificato come elemento padre o figlio.

Infine, è necessario creare una sottoclasse di NSOutlineDelegate per fornire il comportamento per la struttura. Nella Esplora soluzioni fare clic con il pulsante destro del mouse sul progetto e scegliere Aggiungi>nuovo file... Selezionare General Empty Class (Classe vuota Generale>), immettere ProductOutlineDelegate per Name (Nome) e fare clic sul pulsante New (Nuovo).

Modificare il ProductOutlineDelegate.cs file e renderlo simile al seguente:

using System;
using AppKit;
using CoreGraphics;
using Foundation;
using System.Collections;
using System.Collections.Generic;

namespace MacOutlines
{
    public class ProductOutlineDelegate : NSOutlineViewDelegate
    {
        #region Constants
        private const string CellIdentifier = "ProdCell";
        #endregion

        #region Private Variables
        private ProductOutlineDataSource DataSource;
        #endregion

        #region Constructors
        public ProductOutlineDelegate (ProductOutlineDataSource datasource)
        {
            this.DataSource = datasource;
        }
        #endregion

        #region Override Methods

        public override NSView GetView (NSOutlineView outlineView, NSTableColumn tableColumn, NSObject item) {
            // This pattern allows you reuse existing views when they are no-longer in use.
            // If the returned view is null, you instance up a new view
            // If a non-null view is returned, you modify it enough to reflect the new data
            NSTextField view = (NSTextField)outlineView.MakeView (CellIdentifier, this);
            if (view == null) {
                view = new NSTextField ();
                view.Identifier = CellIdentifier;
                view.BackgroundColor = NSColor.Clear;
                view.Bordered = false;
                view.Selectable = false;
                view.Editable = false;
            }

            // Cast item
            var product = item as Product;

            // Setup view based on the column selected
            switch (tableColumn.Title) {
            case "Product":
                view.StringValue = product.Title;
                break;
            case "Details":
                view.StringValue = product.Description;
                break;
            }

            return view;
        }
        #endregion
    }
}

Quando si crea un'istanza ProductOutlineDelegatedi , viene passata anche un'istanza ProductOutlineDataSource di che fornisce i dati per la struttura. Il GetView metodo è responsabile della restituzione di una vista (dati) per visualizzare la cella per una colonna e una riga di tipo give. Se possibile, verrà riutilizzata una visualizzazione esistente per visualizzare la cella, se non è necessario creare una nuova visualizzazione.

Per popolare la struttura, modificare il MainWindow.cs file e fare in modo che il AwakeFromNib metodo sia simile al seguente:

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

    // Create data source and populate
    var DataSource = new ProductOutlineDataSource ();

    var Vegetables = new Product ("Vegetables", "Greens and Other Produce");
    Vegetables.Products.Add (new Product ("Cabbage", "Brassica oleracea - Leaves, axillary buds, stems, flowerheads"));
    Vegetables.Products.Add (new Product ("Turnip", "Brassica rapa - Tubers, leaves"));
    Vegetables.Products.Add (new Product ("Radish", "Raphanus sativus - Roots, leaves, seed pods, seed oil, sprouting"));
    Vegetables.Products.Add (new Product ("Carrot", "Daucus carota - Root tubers"));
    DataSource.Products.Add (Vegetables);

    var Fruits = new Product ("Fruits", "Fruit is a part of a flowering plant that derives from specific tissues of the flower");
    Fruits.Products.Add (new Product ("Grape", "True Berry"));
    Fruits.Products.Add (new Product ("Cucumber", "Pepo"));
    Fruits.Products.Add (new Product ("Orange", "Hesperidium"));
    Fruits.Products.Add (new Product ("Blackberry", "Aggregate fruit"));
    DataSource.Products.Add (Fruits);

    var Meats = new Product ("Meats", "Lean Cuts");
    Meats.Products.Add (new Product ("Beef", "Cow"));
    Meats.Products.Add (new Product ("Pork", "Pig"));
    Meats.Products.Add (new Product ("Veal", "Young Cow"));
    DataSource.Products.Add (Meats);

    // Populate the outline
    ProductOutline.DataSource = DataSource;
    ProductOutline.Delegate = new ProductOutlineDelegate (DataSource);

}

Se si esegue l'applicazione, viene visualizzato quanto segue:

Visualizzazione compressa

Se si espande un nodo nella visualizzazione struttura, sarà simile al seguente:

Visualizzazione espansa

Ordinamento per colonna

Consentire all'utente di ordinare i dati nella struttura facendo clic su un'intestazione di colonna. Prima di tutto, fare doppio clic sul Main.storyboard file per aprirlo per la modifica in Interface Builder. Selezionare la Product colonna, immettere Title per La chiave di ordinamento, compare: per il selettore e selezionare Ascending per l'ordine:

Impostazione dell'ordine dei tasti di ordinamento

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

A questo punto, modificare il ProductOutlineDataSource.cs file e aggiungere i metodi seguenti:

public void Sort(string key, bool ascending) {

    // Take action based on key
    switch (key) {
    case "Title":
        if (ascending) {
            Products.Sort ((x, y) => x.Title.CompareTo (y.Title));
        } else {
            Products.Sort ((x, y) => -1 * x.Title.CompareTo (y.Title));
        }
        break;
    }
}

public override void SortDescriptorsChanged (NSOutlineView outlineView, NSSortDescriptor[] oldDescriptors)
{
    // Sort the data
    Sort (oldDescriptors [0].Key, oldDescriptors [0].Ascending);
    outlineView.ReloadData ();
}

Il Sort metodo consente di ordinare i dati nell'origine dati in base a un determinato Product campo di classe in ordine crescente o decrescente. Il metodo sottoposto SortDescriptorsChanged a override verrà chiamato ogni volta che l'utilizzo fa clic su un'intestazione di colonna. Verrà passato il valore chiave impostato in Interface Builder e l'ordinamento per tale colonna.

Se si esegue l'applicazione e si fa clic nelle intestazioni di colonna, le righe verranno ordinate in base a tale colonna:

Esempio di output ordinato

Selezione riga

Se si desidera consentire all'utente di selezionare una singola riga, fare doppio clic sul Main.storyboard file per aprirlo per la modifica in Interface Builder. Selezionare la visualizzazione struttura nella gerarchia dell'interfaccia e deselezionare la casella di controllo Multiple (Controllo attributi):

Screenshot che mostra l'opzione Controllo attributi in cui è possibile modificare l'impostazione Multiple.

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

Modificare quindi il ProductOutlineDelegate.cs file e aggiungere il metodo seguente:

public override bool ShouldSelectItem (NSOutlineView outlineView, NSObject item)
{
    // Don't select product groups
    return !((Product)item).IsProductGroup;
}

In questo modo l'utente potrà selezionare qualsiasi singola riga nella visualizzazione struttura. Restituisce false per qualsiasi ShouldSelectItem elemento che non si vuole che l'utente sia in grado di selezionare o false per ogni elemento se non si vuole che l'utente sia in grado di selezionare elementi.

Selezione di più righe

Se si desidera consentire all'utente di selezionare più righe, fare doppio clic sul Main.storyboard file per aprirlo per la modifica in Interface Builder. Selezionare la visualizzazione struttura nella gerarchia dell'interfaccia e selezionare la casella di controllo Multipla in Controllo attributi:

Screenshot che mostra Il controllo attributi in cui è possibile selezionare Multiple.

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

Modificare quindi il ProductOutlineDelegate.cs file e aggiungere il metodo seguente:

public override bool ShouldSelectItem (NSOutlineView outlineView, NSObject item)
{
    // Don't select product groups
    return !((Product)item).IsProductGroup;
}

In questo modo l'utente potrà selezionare qualsiasi singola riga nella visualizzazione struttura. Restituisce false per qualsiasi ShouldSelectRow elemento che non si vuole che l'utente sia in grado di selezionare o false per ogni elemento se non si vuole che l'utente sia in grado di selezionare elementi.

Digitare per selezionare riga

Se si desidera consentire all'utente di digitare un carattere con la visualizzazione struttura selezionata e selezionare la prima riga con tale carattere, fare doppio clic sul Main.storyboard file per aprirlo per la modifica in Interface Builder. Selezionare la visualizzazione struttura nella gerarchia dell'interfaccia e selezionare la casella di controllo Tipo seleziona in Controllo attributi:

Modifica del tipo di riga

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

A questo punto, modificare il ProductOutlineDelegate.cs file e aggiungere il metodo seguente:

public override NSObject GetNextTypeSelectMatch (NSOutlineView outlineView, NSObject startItem, NSObject endItem, string searchString)
{
    foreach(Product product in DataSource.Products) {
        if (product.Title.Contains (searchString)) {
            return product;
        }
    }

    // Not found
    return null;
}

Il GetNextTypeSelectMatch metodo accetta l'oggetto specificato searchString e restituisce l'elemento del primo Product con tale stringa in .Title

Riordinare le colonne

Se si desidera consentire all'utente di trascinare le colonne di riordinamento nella visualizzazione struttura, fare doppio clic sul Main.storyboard file per aprirlo per la modifica in Interface Builder. Selezionare la visualizzazione struttura nella gerarchia dell'interfaccia e selezionare la casella di controllo Riordinamento in Controllo attributi:

Screenshot che mostra il controllo attributi in cui è possibile selezionare Riordinamento.

Se si assegna un valore per la proprietà Salvataggio automatico e si controlla il campo Informazioni colonna, le modifiche apportate al layout della tabella verranno salvate automaticamente e ripristinate al successivo esecuzione dell'applicazione.

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

A questo punto, modificare il ProductOutlineDelegate.cs file e aggiungere il metodo seguente:

public override bool ShouldReorder (NSOutlineView outlineView, nint columnIndex, nint newColumnIndex)
{
    return true;
}

Il ShouldReorder metodo deve restituire true per qualsiasi colonna che desidera consentire il trascinamento del trascinamento nell'oggetto newColumnIndex, altrimenti restituire false;

Se si esegue l'applicazione, è possibile trascinare le intestazioni di colonna per riordinare le colonne:

Esempio di riordinamento delle colonne

Modifica di celle

Se si desidera consentire all'utente di modificare i valori per una determinata cella, modificare il ProductOutlineDelegate.cs file e modificare il GetViewForItem metodo come indicato di seguito:

public override NSView GetView (NSOutlineView outlineView, NSTableColumn tableColumn, NSObject item) {
    // Cast item
    var product = item as Product;

    // This pattern allows you reuse existing views when they are no-longer in use.
    // If the returned view is null, you instance up a new view
    // If a non-null view is returned, you modify it enough to reflect the new data
    NSTextField view = (NSTextField)outlineView.MakeView (tableColumn.Title, this);
    if (view == null) {
        view = new NSTextField ();
        view.Identifier = tableColumn.Title;
        view.BackgroundColor = NSColor.Clear;
        view.Bordered = false;
        view.Selectable = false;
        view.Editable = !product.IsProductGroup;
    }

    // Tag view
    view.Tag = outlineView.RowForItem (item);

    // Allow for edit
    view.EditingEnded += (sender, e) => {

        // Grab product
        var prod = outlineView.ItemAtRow(view.Tag) as Product;

        // Take action based on type
        switch(view.Identifier) {
        case "Product":
            prod.Title = view.StringValue;
            break;
        case "Details":
            prod.Description = view.StringValue;
            break;
        }
    };

    // Setup view based on the column selected
    switch (tableColumn.Title) {
    case "Product":
        view.StringValue = product.Title;
        break;
    case "Details":
        view.StringValue = product.Description;
        break;
    }

    return view;
}

A questo punto, se si esegue l'applicazione, l'utente può modificare le celle nella visualizzazione Tabella:

Esempio di modifica delle celle

Uso di immagini nelle visualizzazioni struttura

Per includere un'immagine come parte della cella in un NSOutlineViewoggetto , è necessario modificare il modo in cui i dati vengono restituiti dal metodo della NSTableViewDelegate's GetView visualizzazione struttura per usare un NSTableCellView anziché il tipico NSTextField. Ad esempio:

public override NSView GetView (NSOutlineView outlineView, NSTableColumn tableColumn, NSObject item) {
    // Cast item
    var product = item as Product;

    // This pattern allows you reuse existing views when they are no-longer in use.
    // If the returned view is null, you instance up a new view
    // If a non-null view is returned, you modify it enough to reflect the new data
    NSTableCellView view = (NSTableCellView)outlineView.MakeView (tableColumn.Title, this);
    if (view == null) {
        view = new NSTableCellView ();
        if (tableColumn.Title == "Product") {
            view.ImageView = new NSImageView (new CGRect (0, 0, 16, 16));
            view.AddSubview (view.ImageView);
            view.TextField = new NSTextField (new CGRect (20, 0, 400, 16));
        } else {
            view.TextField = new NSTextField (new CGRect (0, 0, 400, 16));
        }
        view.TextField.AutoresizingMask = NSViewResizingMask.WidthSizable;
        view.AddSubview (view.TextField);
        view.Identifier = tableColumn.Title;
        view.TextField.BackgroundColor = NSColor.Clear;
        view.TextField.Bordered = false;
        view.TextField.Selectable = false;
        view.TextField.Editable = !product.IsProductGroup;
    }

    // Tag view
    view.TextField.Tag = outlineView.RowForItem (item);

    // Allow for edit
    view.TextField.EditingEnded += (sender, e) => {

        // Grab product
        var prod = outlineView.ItemAtRow(view.Tag) as Product;

        // Take action based on type
        switch(view.Identifier) {
        case "Product":
            prod.Title = view.TextField.StringValue;
            break;
        case "Details":
            prod.Description = view.TextField.StringValue;
            break;
        }
    };

    // Setup view based on the column selected
    switch (tableColumn.Title) {
    case "Product":
        view.ImageView.Image = NSImage.ImageNamed (product.IsProductGroup ? "tags.png" : "tag.png");
        view.TextField.StringValue = product.Title;
        break;
    case "Details":
        view.TextField.StringValue = product.Description;
        break;
    }

    return view;
}

Per altre informazioni, vedere la sezione Uso di immagini con visualizzazioni struttura della documentazione sull'uso dell'immagine.

Visualizzazioni struttura data binding

Usando le tecniche di codifica chiave-valore e data binding nell'applicazione Xamarin.Mac, è possibile ridurre notevolmente la quantità di codice che è necessario scrivere e gestire per popolare e usare gli elementi dell'interfaccia utente. È anche possibile separare ulteriormente i dati di backup (Modello di dati) dall'interfaccia utente front-end (Model-View-Controller), semplificando la gestione e la progettazione di applicazioni più flessibili.

Key-Value Coding (KVC) è un meccanismo per accedere indirettamente alle proprietà di un oggetto, usando chiavi (stringhe formattate appositamente) per identificare le proprietà anziché accedervi tramite variabili di istanza o metodi di accesso (get/set). Implementando funzioni di accesso conformi a Key-Value Coding nell'applicazione Xamarin.Mac, è possibile accedere ad altre funzionalità macOS, ad esempio Key-Value Observing (KVO), Data Binding, Core Data, Binding Cocoa e scriptability.

Per altre informazioni, vedere la sezione Struttura Visualizzazione data binding della documentazione sul data binding e sulla codifica chiave-valore.

Riepilogo

Questo articolo ha esaminato in dettaglio l'uso delle visualizzazioni struttura in un'applicazione Xamarin.Mac. Sono stati illustrati i diversi tipi e usi delle visualizzazioni struttura, come creare e gestire le visualizzazioni struttura in Interface Builder di Xcode e come usare le visualizzazioni struttura nel codice C#.