Documentos de Académico
Documentos de Profesional
Documentos de Cultura
Page |2
Resumen
Resumen ...................................................................................................................................... 2
El Problema.................................................................................................................................. 3
Parte 1 Themes & Templates: conceptos bsicos ........................................................................ 3
Parte 2 Themes & Templates: conceptos avanzados ................................................................. 13
Parte 3 User controls: NucliOs .................................................................................................. 19
Page |3
El Problema
Una cadena de supermercados lo contrata para que desarrolle un sistema SmartDevices para que
permita gestionar las filiales, productos, clientes y proveedores. Este sistema va a ser accedido por el
personal desde dispositivos Android y iOS.
En este prctico se usar SmartDevicesPlus para desarrollar el sistema deseado.
Observaciones:
- Crear los dominios:
o Id: numrico de 6.0, auto numrico
o Name: varchar de 40
3. Crear
la
transaccin
Product
como
se
muestra
continuacin:
Page |4
Observacin:
- Crear el dominio Price: numrico de 6.0 y en la propiedad Prefix agregar el
smbolo de ($)
4. Crear la transaccin Branch, que representa las filiales de la cadena, como se muestra
a continuacin:
5. Crear la transaccin Client que almacene los clientes de la empresa como se muestra
a continuacin:
Page |5
Como puede ver las pantallas no tienen un buen look&feel y tendramos que trabajar
un tiempo para generar pantallas ms atrayentes. Qu podemos hacer para que
estas mismas pantallas se vean lindas y con un look estandarizado en toda la
aplicacin en poco tiempo?
Aplicar SD+ en todos los Work With creados, seleccionando el Theme SD+: FlatBlue
y solamente eligiendo la opcin para generar Android porque en este momento
Page |6
Transaccin
Product
Category
Client
Branch
Para realizar esto, se debe hacer clic derecho en la transaccin SD+ Select SD+
template:
Page |7
Luego de seleccionar un SD+ template para cada una de las transacciones hacer lo
siguiente:
a. Cambiar la propiedad Android Base Style del Dashboard para Light
b. Clic derecho Run en el Dashboard Supermarket y visualizar los resultados:
Page |8
7. Se desea tener un panel que solamente muestre los productos de cierta categora
en especial (Groceries). De cada producto en el listado se desea mostrar
solamente la imagen y la descripcin (tenga en cuenta que la descripcin puede
tener muchas lneas). Para este punto no se permite usar el objeto Work With
para Smart Devices.
Qu otra forma provee SD+ para generar la pantalla de forma rpida y con un
look&feel atrayente?
Solucin: Crear los paneles basados en SD+, utilizando atributos o usando SDT.
En este ejercicio es necesario crear dos paneles para probar las dos opciones
(ProductListGroceries_Att y ProductListGroceries_SDT). En ejecucin el usuario va a
visualizar lo mismo en cualquiera de estos paneles. Seleccione el template SD+ que
sea ms adecuado a lo que se desea mostrar en el listado.
Adems, cuando el usuario haga Tap en un registro de esas pantallas se desea
mostrar la informacin detallada de ese producto, de la siguiente forma:
Puede crear un nico panel de detalle para mostrar la informacin luego de realizar
Tap en los dos paneles del listado Productos, de una categora. Este nuevo Panel SD
se llamar ProductGroceriesDetail, y va a ser creado usando el SD+ Template que
Page |9
Para habilitar la accin Tap sobre un registro de la lista de verduras debe efectuar la
accin de Add new Action/Event, por ejemplo OpenProduct y luego desde ambos
SD Panels (ProductListGroceries_Att y ProductListGroceries_SDT) asignar la
propiedad Default Action del grid con el evento recin creado. Luego es necesario
hacer el llamado al panel ProductGroceriesDetail panel para ambos SD Panels (el
implementado con atributos y el implementado con SDTs).
En el SD Panel PoductListGroceries_Att el cdigo asociado a la default action ser el
siguiente:
Event 'OpenProduct'
ProductGroceriesDetail(ProductId)
Endevent
Realizar estos paneles y luego probar en ejecucin los resultados (para eso adicione
dos paneles al Dashboard con imgenes diferentes, y navegue por los dos realizando
Tap en un producto.)
8. Se desea mostrar informacin en un listado para que el gerente del
supermercado analice, pero esa informacin no est en ninguna tabla, es una
informacin fija (podra ser recibida, por ejemplo, de un Web Service). Cmo
hacemos para mostrar informacin que no est disponible en ninguna tabla?
Usamos un panel basado en un SDT. El SDT puede ser cargado a partir de un Data
Provider.
Por lo tanto, importe el XPZ: XPZ_HistoricalInfo, luego cree un Panel
(ShowHistorialInfo) basado en un Template SD+ Title With Amounts y adicione
el cdigo necesario en el Panel SD para que se cargue a partir del DataProvider
importado.
Luego testear en ejecucin los resultados:
P a g e | 10
Style
Contact Cards
Electronics
Home
P a g e | 11
Cmo podemos mostrar diferentes estilos para los registros de un grid en un mismo
listado?
Solucin: Usar el template denominado Cards with multiple layouts, que utiliza la
nueva funcionalidad de GeneXus que permite tener ms de un estilo (layout) para un
mismo grid.
En este ejercicio necesita crear un Nuevo SDPanel (por ejemplo ProductList) usando
el template antes mencionado.
Luego de aplicar el template, es necesario editar el evento load y agregar el cdigo
necesario para habilitar la seleccin del layout correspondiente para cada categora
del producto a cargar.
El cdigo a agregar en el evento load es el siguiente:
Event Load
//By default layout is "Cards"
DataGrid.ItemLayout = "Card"
if CategoryName= "Groceries"
DataGrid.ItemLayout = "ContactCards"
endif
if CategoryName= "Electronics"
DataGrid.ItemLayout = "BannerSubtitle"
endif
if CategoryName= "Home"
DataGrid.ItemLayout = "PostalInfo"
endif
Endevent
P a g e | 12
P a g e | 13
lugar de mostrar la pantalla que estaba siendo visualizada con las localizaciones de
cada sucursal:
Se desea mostrar un mapa donde cada punto del mapa se corresponda a una filial, como se
muestra a continuacin:
P a g e | 14
Cmo podemos hacerlo? Modificar el Template SD+ asignado al objeto List de Filial para
conseguir lo solicitado y luego haga Run del Dashboard para testear los cambios realizados.
Para el caso de un Panel SD creado a partir de un Template SD+, cmo se modifica el
Template SD+ aplicado? Abra el panel ProductGroceries_Att, acceda a la opcin para
modificar el Template SD+ aplicado a ese Panel y luego cancele. Para qu nos sirve la
opcin: Disassociate from SD+ template?
2. Ahora se desea que para los clientes del listado, en lugar de mostrar los datos de los clientes
como informacin adicional, se muestre el hobby (usando el mismo Template SD+ y
solamente modificando sus propiedades).
Antes:
Ahora:
3. Adems se desea que solamente en modo edicin de un registro de un cliente, no sea visible
el campo Full Name (modificar eso desde las propiedades del Template SD+ aplicado):
P a g e | 15
4. La idea de SD+ es que usted pueda modificar un Template SD+ y luego los cambios sean
propagados automticamente (si lo acepta) en todos los Paneles SD y WW SD a los que haya
sido aplicado ese Template. Por el momento esa propagacin se realiza solamente en los
cambios realizados a las propiedades de los controles existentes en ese Template (en las
prximas versiones se va a aadir ms inteligencia a este proceso).
Entonces, si usted desea modificar, por ejemplo, alguna propiedad de un Textblock que se
encuentra en un Template SD, para que se propague en todos los Paneles SD, debe abrir el
Template y realizar el cambio deseado.
En este caso el usuario de la aplicacin solicita que en las pantallas de edicin de un registro
de cualquier entidad (producto, cliente, filial, etc.) el texblock se muestre centrada
horizontalmente (como se muestra debajo) en lugar de mostrarla alineada a la izquierda.
Cmo podemos lograrlo? Cul es el Template SD+ que es necesario modificar? Realice ese
cambio y luego haga Run en el Dashboard Supermarket para verificar que el cambio fue
realizado de forma correcta.
P a g e | 16
Antes:
Ahora:
P a g e | 17
7. SD+ provee varias formas de crear nuevos Templates SD+, cules son?
a. Crear un nuevo objeto SD+ template y comenzar desde una pantalla en blanco.
b. Crear un template SD+ a partir de otro template SD+.
c. Crear un template SD+ a partir de un panel SD: esto es til cuando usted modific a
mano un panel SD.
P a g e | 18
En este caso es necesario tener un SD+ template nuevo que tenga el mismo formato que el
SD+ template aplicado al List de Clientes pero sin datos (o sea un SD+ template que permita
mostrar una imagen y un ttulo para cada registro), sin la descripcin marcada en la imagen a
continuacin:
En este caso, lo ms simple es identificar cual es el SD+ template aplicado a esta pantalla y
hacer un Save As del correspondiente SD+ template modificndolo. Aunque algunas veces es
ms conveniente hacer un nuevo SD+ template a partir de un SD Panel que ya se hubiera
verificado que se est mostrando correctamente de acuerdo a las necesidades.
En la toolbox existen controles que son especficos para los SD+ templates:
Attribute/Variable
Attributes/Variables Region
Text Block
P a g e | 19
P a g e | 20
P a g e | 21