El componente de vista (control de interfaz) iOSTable del framework de Xojo, disponible desde la edición 2014r3, es uno de los principales elmentos en la creación de aplicaciones iOS.

Dicho componente refleja la información en filas que añadamos directamente o bien, preferiblemente, mediante el uso de una clase auxiliar que implemente los métodos definidos por la interfaz de clase iOSTableDataSource.

De este modo será la clase auxiliar la responsable de proporcionar la información correspondiente a cada una de las filas de la tabla a medida que ésta requiera su dibujado. Cada una de estas filas será, en concreto, una instancia de iOSTableCellData.

Sencillo y orientado a objetos; sin duda, el camino que debes de utilizar frente al más tentador y que consiste en añadir las filas de datos directamente con los métodos AddRow o InsertRow, tal y como haríamos en las anteriores versiones del Framework o en las tablas de las aplicaciones de escritorio.

Ahora bien, mientras que la tabla (iOSTable) suponen un elemento para presentar el primer nivel de información, por lo general precisaremos de algún elemento que nos ofrezca la posibilidad de ampliar el detalle de la información representada por cada una de las entradas de la tabla.

Después de todo, en las celdas o filas de la tabla sólo podremos presentar un pequeño fragmento de texto (por lo teneral texto principal y un par de líneas de detalle) junto con una imagen.

iOSTableCellData y las vistas auxiliares

Cada instancia de iOSTableCellData presenta cuatro propiedades sumantente interesantes para representar cada una de las filas en las tablas:

• Text As Text. Este es el texto principal de la fila.
• DetailText As Text. Se corresponde con el par de líneas de texto que se dibujarán bajo el texto principal en la fila de la tabla.
• Image As iOSImage. La imagen para la fila.
• AccessoryType As AccessoryTypes. La propiedad que más nos interesa en este caso, y que se corresponde con la vista auxiliar que utilizará la fila.

Obviamente, como en cualquie objeto, no es obligatorio utilizar todas y cada una de las propiedades, aunque como mínimo es recomendable utilizar Text para que la fila de la tabla refleje alguna información, claro.

Sin embargo y para el caso que nos ocupa en esta entrada, nos fijaremos en la última de las propiedades —AccesoryType—, a la que podemos asignar cualquiera de los valores enumerandos definidos por AccessoryTypes: None, Detail, Checkmark y Disclosure.

De todos ellos, actualmente sólo Detail es capaz de responder al evento iOSTable.AccessoryAction; es decir, el evento que se dispara en la tabla cada vez que hacemos tap sobre dicha vista auxiliar, dándonos así la oportunidad de ejecutar código en consonancia.

Como crear y presentar Vistas Auxiliares

Y llegamos al meollo de la cuestión. Una vez que tenemos claro cómo podemos accionar la respuesta de una AccessoryAction es el momento de que nos preocupemos sobre como hemos de crear la vista auxiliar que se presente como respuesta a dicha acción (el usuario ha hecho “tap” sobre el elemento auxiliar de una fila de la tabla).

¡Pues la solución es bien simple! Tan solo has de añadir a tu proyecto iOS un nuevo componente de vista (Insert > View) y utilizar a continuación cualquiera de los elementos de interfaz de usuario disponibles en la Librería para diseñarla como precises.

Eso sí, en las Propiedades de la nueva vista asegúrate de activar el interruptor correspondiente a NavigationBarVisible de lo contrario ¡la vista cubriría el área de navegación y no se presentaría el chevron que permitiría volver a la vista de origen! (en este caso la que contiene la tabla).

Como parte de las propiedades de cualquier vista también puedes definir su título (Title) y que aparecerá centrado en el área de navegación.

Lo que probablemente también querrás hacer será añadir a la vista una propiedad con un ámbito público de modo que puedas comunicar cualquier objeto desde la tabla hacia esta vista de detalle, como por ejemplo los elementos a presentar o bien cualquier token a partir del cual trabajar.

Presentar nuevas vistas

Ya tenemos nuestra tabla, ya sabemos como presentar elementos auxiliares en cada una de las filas y hemos creado la vista auxiliar. Ya solo queda saber cuál es el mecanismo para presentar la nueva vista de detalle como resultado de que el usuario haga “tap” sobre el elemento auxiliar.

Unos párrafos atrás, vimos que el elemento auxiliar Detail de la iOSTableCellData tiene la capacidad de disparar el evento AccessoryAction en la tabla propiamente dicha. ¡Ahí es donde tiene que ir nuestro código!

Por tanto, seleccionamos la tabla (iOSTable) de nuestra vista principal y, a continuación seleccionamos la opción Add to “tabla” > Event Handler… En la hoja resultante sólo hemos de añadir el evento AccessoryAction. En el Editor de Código resultante introduciremos la siguiente línea de código:

  dim ac as new View2
  ac.accesorio = me.RowData(section, row).DetailText
  self.PushTo(ac)

Teniendo en cuenta que en dicho fragmento de código View2 equivale a la nueva vista auxiliar añadida al proyecto, y que la propiedad accesorio es la propiedad que hemos definido como parte de dicha vista para pasar objetos entre la vista principal (tabla) y la auxiliar. En este caso es simplemente un fragmento de texto.

La línea encargada de añadir la nueva vista en la jerarquía es self.PushTo(ac).

Conclusiones

Como hemos visto, crear una jerarquía de navegación a partir de una tabla es realmente sencillo y podemos conservar la independencia de cada uno de los componentes involucrados en el proceso, lo cual también resulta muy útil para reutilizar los componentes en otros proyectos.