Escribe tu búsqueda

Programación iOS con Xojo: celdas personalizadas

Compartir

A partir de Xojo 2016r2 podemos utilizar en nuestras tablas tantas celdas personalizadas como deseemos, ¡e incluso combinar varias celdas personalizadas en una misma tabla! La libertad de utilizar celdas personalizadas es que estas podrán contener cualquier combinación de controles y elementos en sí mismas, ampliando así notablemente la representación de información más allá de una simple etiqueta de texto y/o imagen o casilla de verificación.

Puedes descargar el proyecto de Xojo con todos los elementos necesarios para seguir este tutorial desde este enlace. Recuerda que también necesitarás descargar Xojo y, por supuesto, las herramientas de Xcode para poder ejecutar el resultado con el Simulador incluido de serie.

iOSCustomTableCell: diseña tus celdas personalizadas

El diseño de las celdas personalizadas en las aplicaciones iOS es posible gracias a la disponibilidad de la nueva clase iOSCustomTableCell y que podemos añadir a nuestro proyectos tal y como haríamos en el caso de cualquier otro control, simplemente arrastrándolo desde la Biblioteca hacia el Navegador de Proyecto (la columna situada más a la izquierda en el IDE).

Como resultado, crearemos una subclase cuya clase superior será iOSCustomTableCell y sobre la que podremos añadir código en los eventos Open y Close, así como definir o acceder a la información correspondiente en las propiedades expuestas: Visible, AccessibilityHint y AccessibilityLabel.

Control de Celda Personalizada iOS en Xojo

En cuanto a la parte visual, y si ya estás acostumbrado a trabajar con los ContainerControl en las aplicaciones Xojo Desktop (OS X, Windows y Linux), entonces encontrarás que las clases derivadas de iOSCustomTableCell proporcionan en cierto modo la misma funcionalidad: una vista, lienzo o “espacio” sobre el cual puedes añadir y disponer cualquier otro de los controles UI disponible, incluyendo aquellos diseñados por nosotros mismos.

Al seleccionar cualquiera de las subclases añadidas al proyecto accederemos al conocido Editor de Diseño, sobre el cual podemos ajustar el tamaño de vista propiamente dicho para nuestra iOSCustomTableCell y también disponer del resto de controles tal y como deseemos presentar la información en nuestras tablas. Por supuesto, cualquiera de los controles añadidos responderá a los eventos ejecutando el código asociado.

Celda de tabla iOS personalizada en Xojo

 

Apps iOS con Xojo: Pintar las celdas en la tabla

Como se ha visto, el diseño de las celdas personalizadas no plantea ningún problema. Ahora bien, ¿cómo podemos indicar a la tabla cuál de las celdas personalizadas queremos utilizar en cada caso, además de actualizar la información propiamente dicha para cada uno de los controles incluidos en las celdas? La respuesta se encuentra en la interface de clase iOSTableDataSource.

Es decir, si bien podemos trabajar con las celdas personalizadas añadiéndolas manualmente desde código, lo más eficiente consiste en definir un objeto que actúe como fuente de datos y que sea interrogado por la propia tabla cada vez que esta requiera el pintado de una celda en concreto, al más puro estilo de los protocolos de clase en Objective-C o Swift. Esta orientación es realmente mejor desde el punto de vista de la OOP (programación orientada a objetos), donde nuestra clase —actuando como proveedora de información— adopta un papel pasivo y ejecutando el código sólo en los casos en los que sea preciso.

Dicho enfoque también es más eficiente en cuanto a la gestión de los recursos consumidos por la tabla propiamente dicha, ¡ya que esta reutilizará la misma celda siempre que sea posible! Esto significa, por tanto, que cada vez que la tabla nos solicite la devolución de una nueva celda hemos de asegurarnos de actualizar correctamente todos los controles de la celda personalizada. De lo contrario, es probable que una celda mostrase algún dato asociado a cualquier celda anterior.

Por tanto hemos de implementar obligatoriamente los métodos RowCount, RowData, SectionCount y SectionTitle sobre la clase que actúe como fuente de datos. En definitiva, estos son los métodos que invocará la tabla cada vez que necesite consultar información para su dibujado.

De entre todos estos métodos, el que nos interesa particularmente para utilizar las celdas personalizadas es RowData; es decir, el invocado por la tabla cada vez que necesita dibujar una nueva celda. De hecho, puedes comprobar que en la signatura de dicho método recibiremos como argumentos una variable que apunta a la tabla propiamente dicha, así como el valor entero de la sección bajo la cual se va a pintar la celda y también el número entero de la fila (celda) que se va a pintar. El método espera que le devolvamos, por tanto, una instancia de iOSTableCellData como resultado.

¿Cómo obtenemos una instancia de iOSTableCellData a partir de nuestro control personalizado iOSCustomTableCell? La respuesta se encuentra en el método CreateCustomCell de la clase iOSTable. Dicho método espera que le pasemos como parámetro la información de Tipo correspondiente a nuestro control, algo que podemos lograr ejecutando la siguiente instrucción de código:

GetTypeInfo(MyCustomCell)

Donde “MyCustomCell” se correspondería con una subclase de iOSCustomTableCell que hayamos añadido al proyecto. Por tanto, la instrucción completa para obtener la iOSTableCellData propiamente dicha sería:

dim cell as iOSTableCellData = table.CreateCustomCell(GetTypeInfo(MyCustomCell))

Acceder a los controles de una iOSCustomTableCell

Ahora bien, al ejecutar la anterior línea de código obtendremos una variable que apunta a una instancia de iOSTableCellData… y eso significa que no podríamos acceder a los controles específicos que hubiésemos definido sobre nuestra clase iOSCustomTableCell. ¿Cómo solucionamos el problema? La respuesta está en la proyección de clases (o Cast).

La proyección de clases consiste en indicar al compilador que deseamos utilizar una instancia de una clase determinada como si fuese de otra. Esto supone un riesgo importante en tiempo de ejecución si no estamos seguros de que la clase sobre la cual deseamos realizar la proyección “encierra” en realida la estructura de objeto correspondiente a la clase sobre la que deseamos trabajar.

En este caso nosotros sabemos con certeza el nombre de las clases que hemos definido como iOSCustomTableCell, y que, de hecho, hemos utilizado su Información de Tipo para generar una instancia de iOSTableCellData. Por tanto, no hay ningún problema en realizar la proyección de clase y almacenar el resultado en una nueva variable, ahora sí, como una instancia de la celda de personalizada que hemos creado. Para ello, hemos de realizar el cast sobre el objeto apuntado por la popiedad Control de la instancia iOSTableCellData:

dim CustomCell as MyCustomCell = MyCustomCell(cell.Control)

A partir de aquí ya utilizaríamos nuestro objeto DataSource en combinación con los controles embebidos en la instancia de nuestra celda personalizada, apuntada por la variable “CustomCell” en este ejemplo, para actualizar toda la información que deseemos dibujar en la celda ¡y listo!

Una vez finalizado, sólo tendremos que devolver el resultado con un sencillo:

return cell

¡Así de simple! Como has visto, crear e implementar celdas personalizadas en proyectos iOS de Xojo es una operación realmente sencilla y que proporciona gran flexibilidad con una mínima cantidad de código y, por tanto, también dolores de cabeza de mantenimiento o posteriores ampliaciones de capacidades.

Dejar un comentario

Twitter
Visit Us
Tweet
YouTube
Pinterest
LinkedIn
Share