Tutoriales para Justinmind Prototyper Nivel básico - Amazon Web ...

escribimos algo en el primer campo de entrada y pulsamos la tecla tabulador
observaremos como el cursor salta al siguiente campo.
Nivel avanzado
Esta sección profundiza en las diferentes opciones de simulación de Justinmind
Prototyper y se enfoca en las que tienen que ver con simulación de datos, listas
dinámicas, formularios y simulación con datos reales.
Listas dinámicas de datos
En este capítulo aprenderemos como simular contenido estructurado ya sea en forma
de tablas o en listas y poblar ese contenido de forma dinámica. Veremos como
funcionan los data masters, el componente de data grid, como simular búsquedas y
como añadir paginación a esas listas de datos. También veremos como preparar una
colección de datos de prueba.
Empezamos creando un data master pulsando el botón de ‘+’ situado en la pestaña de
Data Masters en la parte inferior izquierda de la pantalla. El programa nos muestra un
diálogo para introducir los datos del Data Master. En este ejemplo simularemos una
lista de productos así que el Data Master lo llamaremos Producto. En la futura lista de
productos queremos que aparezca, para cada producto, un código identificador, un
nombre, una descripción y una foto. Añadimos cada uno de estos campos usando el
botón de “+” situado justo debajo de donde hemos puesto el nombre del data master
e indicamos el nombre de cada uno en la tabla situada a su derecha. Una vez añadidos
los atributos podemos observar como, además de una columna nombre, en la tabla
también hay una columna “tipo” y que todos los atributos son de tipo “texto”.
Seleccionamos el tipo “texto” de la fila que ocupa el atributo “foto” y observamos
como sale un desplegable con varios tipos disponibles. Seleccionamos el tipo “fichero”
porque, como veremos, el tipo afecta a como se representa esa información en listas
de datos y en formularios. Por último pulsamos el botón de “ok” no sin antes
seleccionar el id como único atributo del descriptor (el descriptor se usa cuando
asociamos un data master como fuente de datos de un elemento desplegable en una
pantalla).
En la pestaña de Data Master podemos ver como aparece listado el que acabamos de
crear. A continuación arrastramos el elemento Tabla de Datos de la lista de
componentes de pantalla a la pantalla que tenemos abierta en ese momento.
Aparecerá una pantalla para indicar información sobre esa tabla de datos, en concreto
deberemos indicar un identificador, seleccionar el data master que se va a usar como
fuente de datos (en nuestro caso elegimos el único que hay, el de Producto) y qué
atributos del data master se van a usar como columnas en esa lista, en nuestro caso
seleccionamos todos los atributos. Pulsamos aceptar y el programa nos enseña cuanto
va a ocupar la tabla, pulsamos sobre algún lugar de la pantalla y observamos como se
dibuja el data grid con una fila ficticia. Si pulsamos el botón de simular veremos como
la tabla se rellena con tres filas de ejemplo.