Upload
genexus
View
218
Download
4
Embed Size (px)
Citation preview
#GXMX
Agenda
¿Qué es Responsive Web Design?
Características y beneficios
¿Como crear una aplicación Responsive con GX?
¿Qué es RWD?
#GXMX
¿Qué es Responsive Web Design?
#GXMX
#GXMX
Características y beneficios
#GXMX
Características de una aplicación Responsive
Variar la disposición de los controles
Variar la estética de la pantalla
Seleccionar el contenido esencial en la pantallamás pequeña
Beneficios de RWD
Un solo código (HTML & CSS)
Una misma URL
Bajo costo en el desarrollo
Recomendado por Google
#GXMX
Tecnología en la que se basa RWD
Grids fluídos
Media Queries
Medios flexibles
Frontend framework
¿Cómo desarrollar una aplicación Responsive con
GeneXus?
#GXMX
Como desarrollar una aplicación RWD con GeneXus
Objetos definidos automáticamente por GeneXus
Como crear un Web panel responsive
Theme editor: Reglas CSS condicionales
#GXMX
• Transacciones Web
• Prompts Web
• Objetos generados por el pattern Work With
Objetos definidos automáticamente por GeneXus
#GXMX
Propiedades de la versión de la KBs:
#GXMX
#GXMX
Abstract Layout
Como crear un Web panel responsive
#GXMX
#GXMX
Propiedades de la versión de la KB:
#GXMX
33%50%
Extra-Small
Small
Medium y Large
#GXMX
Table 1 Table 2
#GXMX
Table1
Extra-Small (Phone < 768px)
Table2
#GXMX
Small (Tablets >= 768px)
Table1 Table 2
#GXMX
Extra-Small
Small
Medium &Large
33%50%
#GXMX
#GXMX
Theme editor: Reglas CSS condicionales
#GXMX
#GXMX
NUEVAS FUNCIONALIDADES
• Soporte para imágenes de múltiples densidades
• Nuevos controles para RWD :
Upload User Control:
Navigation bar:
Live Editing• Prototipación ágil• El browser como preview
Conferencias relacionadas
Live Editing in Action – 15:30 hrs., Regency Ball Room C