Esquema de vistas en Xamarin.Mac

Artículo
12/02/2021
21 minutos para leer

En este artículo se explica cómo trabajar con vistas de esquema en una aplicación de Xamarin.Mac. Describe cómo crear y mantener vistas de esquema en Xcode Interface Builder y trabajar con ellas mediante programación.

Al trabajar con C# y .NET en una aplicación de Xamarin.Mac, tiene acceso a las mismas vistas de esquema en las que trabaja un desarrollador y Objective-CObjective-C Dado que Xamarin.Mac se integra directamente con Xcode, puede usar el Interface Builder de Xcode para crear y mantener las vistas de esquema (o, opcionalmente, crearlas directamente en código de C#).

Una vista esquema es un tipo de tabla que permite al usuario expandir o contraer filas de datos jerárquicos. Al igual que una vista de tabla, una vista esquema muestra los datos de un conjunto de elementos relacionados, con filas que representan elementos individuales y columnas que representan los atributos de esos elementos. A diferencia de una vista de tabla, los elementos de una vista de esquema no están en una lista plana, se organizan en una jerarquía, como archivos y carpetas en un disco duro.

En este artículo, se tratarán los conceptos básicos de trabajar con vistas de esquema en una aplicación de Xamarin.Mac. Se recomienda encarecidamente que trabaje primero en el artículo Hello, Mac, en concreto en las secciones Introduction to Xcode and Interface Builder and Outlets and Actions (Introducción a Xcode y Interface Builder y salidas y acciones), ya que trata los conceptos y técnicas clave que se usarán en este artículo.

También puede echar un vistazo a la sección del documento Exposing C# classes / methods to Objective-C Exposing C# classes / methods to Objective-C internos de Xamarin.Mac), donde se explican los comandos y que se usan para conectar las clases de C# a objetos y elementos de interfaz de RegisterExportObjective-C usuario.

Introducción a las vistas de esquema

Si un elemento de una vista esquema contiene otros elementos, el usuario puede expandirlo o contraerlo. Un elemento expandible muestra un triángulo de divulgación, que apunta a la derecha cuando el elemento se contrae y apunta hacia abajo cuando se expande el elemento. Al hacer clic en el triángulo de divulgación, el elemento se expande o se contrae.

La vista esquema ( ) es una subclase de la vista de tabla ( ) y, como tal, hereda gran parte de su comportamiento NSOutlineViewNSTableView de su clase primaria. Como resultado, muchas operaciones compatibles con una vista de tabla, como seleccionar filas o columnas, cambiar la posición de las columnas arrastrando encabezados de columna, etc., también son compatibles con una vista esquema. Una aplicación de Xamarin.Mac tiene el control de estas características y puede configurar los parámetros de la vista esquema (ya sea en código o Interface Builder) para permitir o no determinadas operaciones.

Una vista esquema no almacena sus propios datos, sino que se basa en un origen de datos ( ) para proporcionar las filas y columnas necesarias, según sea NSOutlineViewDataSource necesario.

El comportamiento de una vista de esquema se puede personalizar proporcionando una subclase del delegado de vista esquema ( ) para admitir la administración de columnas esquema, escriba para seleccionar la funcionalidad, la selección y edición de filas, el seguimiento personalizado y las vistas personalizadas para columnas y filas NSOutlineViewDelegate individuales.

Dado que una vista esquema comparte gran parte de su comportamiento y funcionalidad con una vista de tabla, es posible que quiera consultar la documentación de vistas de tabla antes de continuar con este artículo.

Creación y mantenimiento de vistas de esquema en Xcode

Cuando se crea una nueva aplicación Xamarin.Mac Cocoa, se obtiene una ventana estándar en blanco de forma predeterminada. Esta ventana se define en un .storyboard archivo incluido automáticamente en el proyecto. Para editar el diseño de windows, en la Explorador de soluciones, haga doble clic en el archivo:

Se abrirá el diseño de la ventana en la ventana de Xcode Interface Builder:

Escriba en el cuadro de búsqueda del inspector de biblioteca para facilitar outline la búsqueda de los controles de vista esquema: outline

Arrastre una vista esquema al controlador de vistas en el Editorde interfaces, haga que rellene el área de contenido del controlador de vistas y esta establezca en donde se reduce y crece con la ventana del Editor de restricciones:

Seleccione la vista Esquema en la jerarquía de interfaz y las siguientes propiedades están disponibles en el Inspector de atributos:

Columna esquema: columna de tabla en la que se muestran los datos jerárquicos.
Guardar automáticamente columna de esquema: si es , la columna Esquema se guardará y restaurará automáticamente entre las ejecuciones de la aplicación.
Sangría: la cantidad para aplicar sangría a las columnas de un elemento expandido.
Sangría sigue a las celdas: si es , se aplica sangría a la marca de sangría junto con las celdas.
Guardar automáticamente elementos expandido: si es , el estado expandido o contraído de los elementos se guardará y restaurará automáticamente entre las ejecuciones de la aplicación.
Modo de contenido: permite usar vistas ( ) o celdas ( ) para mostrar NSCell los datos en las filas y columnas. A partir de macOS 10.7, debe usar Vistas.
Filas de grupo floats: si es , la vista Tabla dibujará celdas agrupadas como si hubieran estado flotantes.
Columnas: define el número de columnas que se muestran.
Encabezados: si es , las columnas tendrán encabezados.
Reordenación: si es , el usuario podrá arrastrar para volver a ordenar las columnas de la tabla.
Cambio de tamaño: si es , el usuario podrá arrastrar los encabezados de columna para cambiar el tamaño de las columnas.
Ajuste de tamaño de columna: controla cómo la tabla dimensiona automáticamente las columnas.
Resaltar: controla el tipo de resaltado que usa la tabla cuando se selecciona una celda.
Filas alternativas: si es , cualquier otra fila tendrá un color de fondo diferente.
Cuadrícula horizontal: selecciona el tipo de borde dibujado entre las celdas horizontalmente.
Cuadrícula vertical: selecciona el tipo de borde dibujado entre celdas verticalmente.
Color de cuadrícula: establece el color del borde de la celda.
Fondo: establece el color de fondo de la celda.
Selección: permite controlar cómo el usuario puede seleccionar las celdas de la tabla como:
- Varios: si es , el usuario puede seleccionar varias filas y columnas.
- Columna: si es , el usuario puede seleccionar columnas.
- Seleccionar tipo: si es , el usuario puede escribir un carácter para seleccionar una fila.
- Vacío: si , el usuario no tiene que seleccionar una fila o columna, la tabla no permite ninguna selección.
Autoguardar: el nombre en el que se guarda automáticamente el formato de las tablas.
Información de columna: si es , el orden y el ancho de las columnas se guardarán automáticamente.
Saltos de línea: seleccione cómo controla la celda los saltos de línea.
Trunca la última línea visible: si es , la celda se truncará en los datos que no caben dentro de sus límites.

Importante

A menos que mantenga una aplicación de Xamarin.Mac heredada, se deben usar vistas de esquema basadas NSView en vistas de tabla NSCell basadas. NSCell se considera heredado y es posible que no se puedan usar en el futuro.

Seleccione una columna de tabla en la jerarquía de interfaz y las siguientes propiedades están disponibles en el Inspector de atributos:

Título: establece el título de la columna.
Alineación: establece la alineación del texto dentro de las celdas.
Fuente del título: selecciona la fuente del texto de encabezado de la celda.
Clave de ordenación: es la clave que se usa para ordenar los datos de la columna. Déjelo en blanco si el usuario no puede ordenar esta columna.
Selector: es la acción que se usa para realizar la ordenación. Déjelo en blanco si el usuario no puede ordenar esta columna.
Order: es el criterio de ordenación de los datos de las columnas.
Redimensionar: selecciona el tipo de tamaño de la columna.
Editable: si es , el usuario puede editar las celdas de una tabla basada en celdas.
Oculto: si es , la columna está oculta.

También puede cambiar el tamaño de la columna arrastrando su identificador (centrado verticalmente en el lado derecho de la columna) a la izquierda o derecha.

Vamos a seleccionar cada columna de nuestra vista de tabla y a dar a la primera columna un título de y a la segunda. Details

Seleccione una vista de celda de tabla ( ) en la jerarquía de interfaz y NSTableViewCell las siguientes propiedades están disponibles en el Inspector de atributos: NSTableViewCell

Estas son todas las propiedades de una vista estándar. También tiene la opción de volver a tamaño de las filas de esta columna aquí.

Seleccione una celda de vista de tabla (de forma predeterminada, es ) en la jerarquía de interfaz y las siguientes propiedades están NSTextField disponibles en el Inspector de atributos: NSTextField

Tendrá todas las propiedades de un campo de texto estándar que se establecerá aquí. De forma predeterminada, se usa un campo de texto estándar para mostrar los datos de una celda de una columna.

Seleccione una vista de celda de tabla ( ) en la jerarquía de interfaz y NSTableFieldCell las siguientes propiedades están disponibles en el Inspector de atributos: NSTableFieldCell

La configuración más importante aquí es:

Diseño: seleccione cómo se disposición de las celdas de esta columna.
Usa el modo de línea única: si es , la celda se limita a una sola línea.
Primer ancho de diseño en tiempo de ejecución: si es , la celda preferirá el ancho establecido para él (ya sea manualmente o automáticamente) cuando se muestre la primera vez que se ejecute la aplicación.
Acción: controla cuándo se envía la acción editar para la celda.
Comportamiento: define si una celda se puede seleccionar o editar.
Texto enriquecido: si es , la celda puede mostrar texto con formato y estilo.
Deshacer: si es , la celda asume la responsabilidad de su comportamiento de deshacer.

Seleccione la Vista de celda de tabla ( NSTableFieldCell ) en la parte inferior de una columna de tabla en la jerarquía de NSTableFieldCell:

Esto le permite editar la vista de celda de tabla que se usa como patrón base para todas las celdas creadas para la columna especificada.

Agregar acciones y salidas

Al igual que cualquier otro control de la interfaz de usuario de Cocoa, es necesario exponer nuestra vista esquema y sus columnas y celdas en el código de C# mediante acciones y salidas (en función de la funcionalidad necesaria).

El proceso es el mismo para cualquier elemento de vista de esquema que se quiera exponer:

Cambie al Editor del asistente y asegúrese de que el archivo está seleccionado:
Seleccione la vista Esquema de la jerarquía de interfaz,haga clic con el botón de control y arrástrela al archivo.
Cree una salida para la vista esquema denominada :
Cree salidas para las columnas de tablas también denominadas y DetailsColumn :
Guarde los cambios y vuelva a Visual Studio para Mac para sincronizar con Xcode.

A continuación, escribiremos que el código muestre algunos datos para el esquema cuando se ejecute la aplicación.

Rellenar la vista esquema

Con nuestra vista esquema diseñada en Interface Builder y expuesta a través de una salida ,a continuación, es necesario crear el código de C# para rellenarlo.

En primer lugar, vamos a crear una nueva clase para contener la información de las filas y grupos Product individuales de los productos. En la Explorador de soluciones, haga clic con el botón derecho en el Project y seleccione Agregar nuevo archivo... Seleccione GeneralEmpty Class (Clase vacíageneral), escriba en Name (Nombre) y haga clic en el botón New (Nuevo):

Haga que Product.cs el archivo sea parecido al siguiente:

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
    }
}

A continuación, es necesario crear una subclase de NSOutlineDataSource para proporcionar los datos de nuestro esquema a medida que se solicitan. En la Explorador de soluciones, haga clic con el botón derecho en el Project y seleccione Agregar nuevo archivo... Seleccione GeneralEmpty Class (Clase vacíageneral), escriba en Name (Nombre) y haga clic en el botón New (Nuevo).

Edite ProductTableDataSource.cs el archivo y haga que sea parecido al siguiente:

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
    }
}

Esta clase tiene almacenamiento para los elementos de la vista esquema e invalida para GetChildrenCount devolver el número de filas de la tabla. devuelve un elemento primario o secundario específico (solicitado por la vista esquema) y define el elemento especificado como elemento primario GetChildItemExpandable o secundario.

Por último, es necesario crear una subclase de NSOutlineDelegate para proporcionar el comportamiento de nuestro esquema. En la Explorador de soluciones, haga clic con el botón derecho en el Project y seleccione Agregar nuevo archivo... Seleccione GeneralEmpty Class (Clase vacíageneral), escriba en Name (Nombre) y haga clic en el botón New (Nuevo).

Edite ProductOutlineDelegate.cs el archivo y haga que sea parecido al siguiente:

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
    }
}

Cuando se crea una instancia de , también se pasa una instancia de ProductOutlineDelegate que proporciona los datos para el ProductOutlineDataSource esquema. El GetView método es responsable de devolver una vista (datos) para mostrar la celda de una columna y fila de tipo give. Si es posible, se reutilizará una vista existente para mostrar la celda, si no se debe crear una nueva vista.

Para rellenar el esquema, vamos a editar el MainWindow.cs archivo y hacer que el método sea parecido al AwakeFromNib siguiente:

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);

}

Si ejecutamos la aplicación, se muestra lo siguiente:

Si expandemos un nodo en la vista Esquema, tendrá el siguiente aspecto:

Ordenación por columna

Vamos a permitir que el usuario ordene los datos en el esquema haciendo clic en un encabezado de columna. En primer lugar, haga doble Main.storyboard clic en el archivo para abrirlo para editarlo en Interface Builder. Seleccione la Product columna , escriba para la clave de TitleProduct, compare: para el Title y seleccione para Ascending el compare::

Guarde los cambios y vuelva a Visual Studio para Mac para sincronizar con Xcode.

Ahora vamos a editar el ProductOutlineDataSource.cs archivo y agregar los métodos siguientes:

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 ();
}

El método nos permite ordenar los datos en el origen de datos en función de un campo de clase determinado en orden ascendente SortProduct o descendente. Se llamará al SortDescriptorsChanged método invalidado cada vez que el uso haga clic en un encabezado de columna. Se le pasará el valor de clave que establecimos en Interface Builder y el criterio de ordenación de esa columna.

Si ejecutamos la aplicación y hacemos clic en los encabezados de columna, las filas se ordenarán por esa columna:

Selección de filas

Si desea permitir que el usuario seleccione una sola fila, haga doble clic en el archivo para abrirlo para editarlo Main.storyboard en Interface Builder. Seleccione la vista Esquema en la jerarquía de interfaz y desactive la casilla Varios en el Inspector de atributos:

Guarde los cambios y vuelva a Visual Studio para Mac para sincronizar con Xcode.

A continuación, ProductOutlineDelegate.cs edite el archivo y agregue el método siguiente:

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

Esto permitirá al usuario seleccionar cualquier fila única en la vista Esquema. Vuelva para para cualquier elemento que no desee que el usuario pueda seleccionar o para cada elemento si no desea que el usuario pueda seleccionar falseShouldSelectItem ningún false elemento.

Selección de varias filas

Si desea permitir que el usuario seleccione varias filas, haga doble clic en el archivo para abrirlo para editarlo Main.storyboard en Interface Builder. Seleccione la vista Esquema en la jerarquía de interfaz y active la casilla Varios en el Inspector de atributos:

Guarde los cambios y vuelva a Visual Studio para Mac para sincronizar con Xcode.

A continuación, ProductOutlineDelegate.cs edite el archivo y agregue el método siguiente:

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

Tipo para seleccionar fila

Si desea permitir que el usuario escriba un carácter con la vista esquema seleccionada y seleccione la primera fila que tenga ese carácter, haga doble clic en el archivo para abrirlo para editarlo en Main.storyboard Interface Builder. Seleccione la vista Esquema en la jerarquía de interfaz y active la casilla Seleccionar tipo en el Inspector de atributos:

Guarde los cambios y vuelva a Visual Studio para Mac para sincronizar con Xcode.

Ahora vamos a editar el ProductOutlineDelegate.cs archivo y agregar el método siguiente:

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;
}

El GetNextTypeSelectMatch método toma el especificado y devuelve el elemento del primero que tiene esa cadena en su searchStringProduct . Title

Reordenación de columnas

Si desea permitir que el usuario arrastre las columnas de reordenación en la vista Esquema, haga doble clic en el archivo para abrirlo para editarlo en Main.storyboard Interface Builder. Seleccione la vista Esquema en la jerarquía de interfaz y active la casilla Reordenar en el Inspector de atributos:

Si se proporciona un valor para la propiedad Autosave y se comprueba el campo Información de columna, los cambios que realicemos en el diseño de la tabla se guardarán automáticamente y se restaurarán la próxima vez que se ejecute la aplicación.

Guarde los cambios y vuelva a Visual Studio para Mac para sincronizar con Xcode.

Ahora vamos a editar el ProductOutlineDelegate.cs archivo y agregar el método siguiente:

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

El método debe devolver para cualquier columna que quiera permitir que se arrastre ShouldReordertrue reordenada a newColumnIndex , de lo contrario, devuelve false ;

Si ejecutamos la aplicación, podemos arrastrar encabezados de columna para reordenar nuestras columnas:

Edición de celdas

Si desea permitir que el usuario edite los valores de una celda determinada, edite el archivo y cambie el ProductOutlineDelegate.cs método como se muestra a GetViewForItem continuación:

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;
}

Ahora, si ejecutamos la aplicación, el usuario puede editar las celdas en la vista tabla:

Usar imágenes en vistas de esquema

Para incluir una imagen como parte de la celda en , deberá cambiar la forma en que el método de la vista esquema devuelve los datos para usar en lugar del típico NSOutlineViewNSTableViewDelegate'sGetViewNSTableCellViewNSTextField . Por ejemplo:

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;
}

Para obtener más información, consulte la sección Uso de imágenes con vistas de esquema de nuestra documentación sobre cómo trabajar con imágenes.

Vistas de esquema de enlace de datos

Al usar Key-Value codificación y enlace de datos en la aplicación Xamarin.Mac, puede reducir considerablemente la cantidad de código que tiene que escribir y mantener para rellenar y trabajar con elementos de la interfaz de usuario. También tiene la ventaja de desacomanar aún más los datos de respaldo(modelode datos) de su front-end Interfaz de usuario(modelo-vista-controlador),lo que facilita el mantenimiento y el diseño de aplicaciones más flexible.

Key-Value Coding (KVC) es un mecanismo para acceder indirectamente a las propiedades de un objeto, mediante claves (cadenas con formato especial) para identificar propiedades en lugar de tener acceso a ellas a través de variables de instancia o métodos de accessor ( get/set ). Al implementar Key-Value compatibles con codificación en la aplicación Xamarin.Mac, obtendrá acceso a otras características de macOS, como Key-Value Observing (KVO), enlace de datos, datos principales, enlaces de Cocoa y capacidad de script.

Para obtener más información, consulte la sección Enlace de datos de la vista esquema de nuestra documentación sobre enlace de Key-Value codificación.

Resumen

En este artículo se ha detallado cómo trabajar con vistas de esquema en una aplicación de Xamarin.Mac. Vimos los diferentes tipos y usos de vistas de esquema, cómo crear y mantener vistas de esquema en el Interface Builder de Xcode y cómo trabajar con vistas de esquema en código de C#.

MacOutlines (ejemplo)
MacImages (ejemplo)
Hello, Mac
Vistas de tabla
Listas de origen
Enlace de datos y codificación de clave-valor
OS X Human Interface Guidelines (Directrices de interfaz humana de OS X)
Introducción a las vistas de esquema
NSOutlineView
NSOutlineViewDataSource
NSOutlineViewDelegate

Esquema de vistas en Xamarin.Mac

Valore su experiencia

Introducción a las vistas de esquema

Creación y mantenimiento de vistas de esquema en Xcode

Agregar acciones y salidas

Rellenar la vista esquema

Ordenación por columna

Selección de filas

Selección de varias filas

Tipo para seleccionar fila

Reordenación de columnas

Edición de celdas

Usar imágenes en vistas de esquema

Vistas de esquema de enlace de datos

Resumen

Vínculos relacionados