Mostraremos las primeras pantallas que resultarán de nuestro nuevo generador responsivo y explicaremos el funcionamiento de los nuevo controles "PXTools Responsive Layout" y "PXTools Smart Menus".

1. PXTools: Nuevo
generador y nuevos
controles responsivos
Ing. Juan Marcelo Bustamante
@jmblamas @pxtoolsuy
jmbl@puntoexe.com.uy

2. PXTools

3. #GXMX
8 Patrones
– WorkWith
– Parameter Request
– Composer
– Flow Controller
– OAV
– Synchronization
– Audit
– ReportTemplate
26 Módulos
– APIs
– Menus
– Process Status
– Send Mails
– Receive Mails
– System Parameters
– Alerts
– BatchPrint
– Control Preferences
– Documents
– Dynamic Call References
– System
– Projects
– Task Manager
– Audit Log
– OAV
– PeopleOrganizations
– Security
– Synchronization Log
– Synchronization Web Services
– Countries States Cities
– Printer Markup Language
– Issue Tracking
– File Storage
– Internet of Things
– BeagleBone
3 Módulos SD
– Help
– No?fica?ons
– Beacons
7 User Controls
– Password Quality Checker
– ScrollLine
– Password Flash Letter
– Password SD
– InConcert
– Responsive Layout
– Smart Menus
10 Extensiones
– Instance Find and Replace
– License Manager
– Install Manager
– Apply Default
– Instance Attacher
– Revert to Previous Date Version
– Change Referece
– Save Modules
– Save Objects
– Generate Web Startup Object
3 External Objects
– PXToolsSD (SMS & Bluetooth)
– Java File Properties
– Java Chart Generator
2 External Programs
– XPZ Converter
– KB Synchroniza?on

4. #GXMX
Patterns UI
Filosofía PXTools
Web Desktop
Smart Devices
Web Responsive

5. PXTools
Generador Web Desktop

6. #GXMX
Generador Web Desktop y GXUI

7. #GXMX
Generador Web Desktop y GXUI

8. #GXMX
Generador Web Desktop y GXUI
• Orden por Títulos
• Scroll Interno
• Ocultamiento de
Columnas
• Cambio de posición de
columnas

9. PXTools
Generador Web Responsivo

10. #GXMX
Web
Responsivo
Generador Web Responsivo
Desktop
Smart Devices

11. PXTools
Generador Web Responsivo
para Smart Devices

12. #GXMX
Smart Devices
49%
36%
15%

13. #GXMX
Smart Devices

14. #GXMX
Smart Devices

15. #GXMX
Generador Responsivo

16. #GXMX
Generador Responsivo

17. #GXMX
Generador Responsivo - Demo
• Insert con carga de variables antes de llamar a Transacción.
• Modelo con acciones fuera y dentro de grilla.
• Búsqueda única
• Búsqueda avanzada y órdenes predefinidos
• Orden por columnas por base de datos
• Controles avanzados de paginación
• Manejo de Template
• Interacción con JQuery y JQueryUI

18. #GXMX
Nuevos métodos soportados (UC / Javascript)
• Métodos de Posicionamiento (JQueryUI)
– Position
– ParentPosition
• Métodos y Eventos relacionados a acciones del Mouse (JQuery)
– OutsideEvent
– ParentOutsideEvent
– OnOutsideClick
• Cambiar clases de elementos desconocidos x GeneXus (JQuery)
– AddClass
– RemoveClass

19. #GXMX
Nuevos métodos soportados (GeneXus)
• Cambio de clases de elementos conocidos por GeneXus
– AddClass
– HasClass
– RemoveClass
– RemoveHiddenClasses
– RemoveOffsetClasses
– ReplaceClass
– ToogleClass
– ToogleClasses
– ToogleClassRemoveOffset
– ToogleShowHideClasses

20. PXTools
Responsive Layout

21. #GXMX
PXTools Responsive Layout
TOP
LEFT CENTER RIGHT
BOTTOM

22. #GXMX
PXTools Responsive Layout
BETWEEN FULL

23. #GXMX
PXTools Responsive Layout

24. #GXMX
PXTools Responsive Layout - Demo
• User Control en el Development Environment.
• Carga de parámetros basados en DataProvider.
• Soporte de plataformas: Dimensiones y Tipo de Dispositivo.
• Modo de regiones: Push o Float y Smart para región Top.
• Regiones Left y Right: Full o entre Top y Bottom.
• Adaptabilidad según cambios de plataformas.
• Bloqueo del resto de las áreas al Flotar.
• Superposición de áreas Flotantes según orden de aparición.
• Manejo de scroll único o scroll por cada área.
• Métodos para realizar cambios en Run-Time

25. #GXMX
PXTools Responsive Layout - Métodos soportados
• Métodos de Visibilidad
– Show, Hide, ToogleVisible
• Métodos relacionados a Modos
– Float, Push, ToogleMode
• Métodos relacionados a manejo de Smart Top
– Maximize, Minimize, ToogleSize
• Propiedades para saber el estado de cada región

26. PXTools
Smart Menus

27. #GXMX
PXTools Smart Menus
http://www.smartmenus.org/

28. #GXMX
PXTools Smart Menus

29. #GXMX
PXTools Smart Menus
Opción 1 Opción 2 Opción 4Opción 3
Opción 5
Opción 7
Opción 6

30. #GXMX
PXTools Smart Menus
Opción 1 Opción 3Opción 2
Opción 4
Opción 7
Opción 5
Opción 6

31. #GXMX
PXTools Smart Menus - Demo
• User Control en el Development Environment.
• Carga de datos basados en DataProvider.
• Comportamientos:
– Horizontal Responsivo Push
– Horizontal Responsivo Float
– Horizontal Smart
– Vertical
• Propiedad de cambio de comportamiento responsivo
• Propiedad de cambio de tema.

32. Precios

33. #GXMX
PXTools Responsive Layout
USD 94

34. #GXMX
PXTools Smart Menu
USD 26

35. #GXMX
¿Preguntas?

36. ¡MUCHAS GRACIAS!
Ing. Juan Marcelo Bustamante
jmbl@puntoexe.com.uy
@jmblamas @pxtoolsuy