Curso de Web-Dynpro

Programa de Capacitación
SAP Web Dynpro

Elaborado por MVM Ingeniería de Software
Josué David Cruz Soriano
Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Nota
• Algunos gráficos y textos han sido
copiados de fuentes y material de SAP y
solo podrán ser usados para temas
didácticos.

Introducción
SAP Java Development Environment
Introducción a Web Dynpro
Web Dynpro Controllers
El Context en tiempo de diseño
Elementos de Interface de Usuario
Mensajes y soporte a lenguajes
Servicios de Interface de Usuario Genéricos
Debugging
Modificaciones dinámicas en tiempo de ejecución
Web Dynpro Models : Adaptive RFC Layer

Introducción : Java Development Infrastructure
Proveer una integrada y

robusta infraestructura de
desarrollo para proyectos de
Java e incluir esta herramienta
en los productos de desarrollo
de SAP, cubriendo los
siguientes puntos:
• Cubrir el ciclo completo de proyectos Java.

• Reducir los costos de profesionales en proyectos Java.
• Acelerar el proceso de desarrollos.
• Incrementear la calidad de los productos basados en Java.

Arquitectura de la plataforma Eclipse
• El proyecto Eclipse empezó en 2001 en IBM, como un proyecto código abierto bajo
la licencensia (CPL). SAP Netweaver Development Studio esta integrado en Eclipse.
• Eclipse implementa la habilidad de mejorar el ambiente de desarrollo mediante
Plug-Ins.

Eclipse UI

Eclipse UI
• La interface de usuario (Perspective, Views, Editor)

– El Workbench de Eclipse ofrece algunas perspectivas y vistas para todo
el proceso del desarrollo.
• Una perspectiva consta de muchas vistas y editores.
• Una vista es usada para navegar entre informaciòn
• Un editor puede ser usado para modificar código fuente.

Introducción
Debugging

SAP NetWeaver Developer Studio
• SAP NetWeaver Developer Studio está basado en la plataforma libre

Eclipse. SAP NetWeaver Developer Studio es un ambiente de desarrollo
para todas las áreas de aplicaciones empresariales Java.
– Interfaces de Usuario : SAP Web Dynpro es usado para desarrollar interfaces web
flexibles.
– Lógica de Negocio : Soporte a desarrollar y deployar EJB´s, la definición y publicación
de Web Services.
– Java Persistence : Embebe SQL en Java (SQLJ)

SAP Netweaver Developer Studio:Instalación
• SAP NetWeaver Developer Studio, puede ser instalado con el SAP Web AS
o puede ser instalado stand-alone.
• Requerimientos del sistema:
– 512 Mb RAM (Mínimo)
– 1 GB RAM (Recomendado)
– 300 Mb espacio en disco
– JDK 1.4.2 o superior
• Instalación
1. Instalar Java 1.4.2 o superior.
2. Bajar SAP Netweaver Developer Studio de la fuente
https://www.sdn.sap.com/irj/sdn/downloads
3. Correr el programa de instalación, en la ruta …/J2EE-RUNT-
CD/IDE/JDTSetup.exe

4. Dar clic en el botón “Siguiente”

5. Escoger la ruta y el lugar de instalación y dar clic en el botón

siguiente.

6. Seleccionar “SAP Netweaver Developer Studio” y dar clic en el

botón “Siguiente”.

7. Dar clic en el botón “Install”.

8. Seleccionar la ruta del JDK de Java y dar clic en el botón

“Siguiente”

9. Al finalizar la instalación dar clic en el botón “Terminar”.

Introducción
Debugging

¿Qué es Web Dynpro?
• Desde un punto de vista técnico, SAP´s Web Dynpro para Java es
un paso revolucionario al desarrollo de interfaces de usuario
basadas en la web.
• Es un modelo de programación basado en interfaces de usuario.
– Define una estructura estándar para las aplicaciones de usuario,
usando el patrón de diseño MVC (“model-view-controller”).
• Define un conjunto de herramientas para el diseño de interfaces de
usuario.
• Es una tecnología para modula izar el software.

Beneficios de Web Dynpro
• El principal objetivo de Web Dynpro es habilitar

a los desarrolladores de una herramienta para
construir aplicaciones Web con el mínimo
esfuerzo.
– Minimiza código, maximiza el diseño.

– Separa el marco de la lógica.
– Rehusó de componentes.
– Corre en múltiples plataformas.
– Internacionalización.

Escenarios de aplicación de Web Dynpro
• Un modelo de Web
Dynpro puede ser
alimentado con
información de las
siguientes fuentes:
– Módulos RFC
– Enterprise Java Beans
(EJBs), los cuáles
encapsulan lógica de la
aplicación.
– Web Services.

Model View Controller (MVC)
• El diseño clásico de MVC crea una arquitectura para desacoplar los datos.
• Desacopla la lógica de presentación de la lógica de la aplicación.
• Desacopla la lógica de negocio de la lógica de la aplicación.

Web Dynpro Component
• La arquitectura de Web Dynpro puede ser dividida en cuatro cuadrantes:

• La línea punteada horizontal separa las entidades que son visibles fuera
del componente, de las que son visibles fuera del componente.
• La línea punteada vertical separa las entidades no visuales, o entidades
programables.
• Las únicas partes de un Web Dynpro Component que están visibles hacía el
mundo son: Interface View, Interface Controller.

Web Dynpro Component Interface
• The Component Interface

El Component Interface consiste de cero o más partes visuales y una
programable
• El Interface Controller es la interface programable que da acceso a la
funcionalidad del componente.
• El Interface View es un componente visual reutilizable que puede ser
presentado a través de un Web Dynpro Framework genérico.

Web Dynpro Application
• Una aplicación Web Dynpro es el único punto de entrada a un Web Dynpro

Component y puede ser solo invocado vía URL.
• En orden de definir una aplicación Web Dynpro, se debe definir:
• El componente para ser invocado. Este componente es conocido como
“root” component.
• El Interface View de el root component será usado como la vista inicial.
• El Inbound Plug actua como punto de entrada al Interface View.

Terminología Básica
• El nodo root de un Web Dynpro Project representa una unidad deployable de

código.
• El nodo Web Dynpro es el nodo dentro del cuál todas aplicaciones Web Dynpro,
models y componentes viven.
• Cada proyecto o componente de desarrollo tiene dos tipos de diccionario:
• Un diccionario local en el que son definidos tipos de datos.
• Un diccionario separado por modelo.

Terminología básica (2)
• Web Dynpro Component Interfaces

• Si otro diferente Web Dynpro Component es necesario para implementar una interface
común, entonces se definen interfaces genéricas como esta.
• Un Component representa un conjunto de tareas que forman una unidad lógica de negocio.
• Un View es el único tipo de control visual.
• Window define la interface visual de una aplicación Web Dynpro.

Terminología básica (3)
• Custom Controllers – Son usados para encapsular unidades de funcionalidad

que son compartidas por algunos controladores y no son directamente usadas
para la interacción con el usuario. Ej. Cuando se llama una BAPI y el resultado
requiere ser ordenado antes de presentarse.
• Component Controller – Este es el controlador que direccionara la funciona-
lidad a todo el componente. Es creado cuando el componente es creado.
• Interface Controller – Es el único controlador visible a otros components.
• View Controller – Son usados para manejar todos los aspectos relacionados
con los aspectos de desplegar datos e interacciones de usuario.

Custom Controller Arquitecture
• Todos los Custom Controllers guardan sus datos en una jerarquía llamada
Context.
• Todos los Controllers son programas independientes que no tienen ningún
función en otros Controllers.
• El Custom Controller reside en memoria hasta que su componente exista.

View Controller Arquitecture
• Un window es el conjunto de todas las posibles vistas que pueden ser

visibles en la pantalla.
• Un window puede tener uno o más view sets dentro de ella.
• Un view set es subdividido en view areas en las cuales se puede deplegar
una o más windows.
• Un view area puede solo desplegar un view

Navegación entre Views
• Navigation Modeler
Es un editor gráfico en el cuál se pueden definir links de navegación que
existen entre varias views.
• El Navigation Modeler permite manipular:
• View Sets
• Views
• Inbound and Outbund Plugs
• Navigation Links

Navegación entre Views (2)
• Outbund Plugs
Llamar a un método Outbund Plug provoca lanzar un evento de
navegación.
• Inbound Plugs
Inbound Plugs son métodos manejadores de eventos que son invocados
cuando se disparo un evento Outbund Plug.
• Links
Outbund e Inbound Plugs son relacionados a través de un Link, creado en
el Navigation Editor.

Context Mapping
• Context Mapping
Context Mapping permite a un nodo del contexto de un controller suplir o
compartir datos con otro nodo de contexto de otro controlador. Este es el principal
mecanismo para compartir datos entre controladores.

Poniendo datos en la pantalla: Data Binding
• Data Binding
Data Binding significa que los datos son automáticamente transportados del
contexto de unView Controller a un elemento UI.

Web Dynpro Models
• Web Dynpro Models

Un Web Dynpro Model encapsula una variada funcionalidad que es externa
de Web Dynpro. Ej. El llamado a una BAPI

Ejercicio 1

Introducción
Debugging

• Contenido
• Standard hook methods
• Instance methods
• Events and events handlers
• Actions and plugs
• Shorcut variables

Standard Hook Methods
• Implementación de código
Cada Web Dynpro Controller es un programa de Java. La definición de estos
programas es generada automáticamente.
• Standard Hook Methods
En cada Controller hay ciertos métodos que siempre están presentes. Estos
métodos viene vacíos y se puede agregar cualquier código que el
programador desee.

Standard Hook Methods, para todos los
Controllers
• wdDoInit ()
Este método es llamado una sola vez durante el ciclo de vida del controller.
Toda la inicialización debería hacerse aquí.
• wdDoExit()
Este método es llamado únicamente en el término de vida del controller.

Standard Hook Methods – Component Controller
• wdDoPostProcessing()
Es posible usar este método para validar datos antes que el proceso de
negocio tome el control del programa.
• wdBeforeNavigation()
Este método es llamado solo antes se procesan los procesos de navegación,
esto permite implementar código para modificar la navegación.

Standard Hook Methods – View Controller
• El método será llamado solo sí:

• Cuando el view es la primera vez que se ejecuta.
• Cuando el view ha realizado algún evento o acción que modifique el
procesamiento del view controller.

Controller Instance Methods
• Controller Instance Methods

Estos métodos aplican para “View” y “Custon Controllers”. Para estos dos
controllers se pueden declarar métodos desarrollados por el desarrollador

Creating Instance Methods
• Para crear un Intance Method, edita el Controller y escoge el tab Methods y dar
click en el botón New.
• Seleccionar si se requiere crear un normal method o un event handler method.
• Seleccionar el nombre y tipo de retorno del método.
• Finalmente seleccionar los parámetros que recibe el método.

Member Variables and Utility Methods
• //@@begin others
• Este bloque delimita el área en la cuál se puede colocar todas las
declaraciones de member variables y declaraciones estáticas de métodos.
Estas declaraciones serán visibles para todo el controller.
• El código puesto aquí solo será visible para el controller donde se definan.
• Utility methods pueden ser declarados aquí. Ej. Suma (a, b).

Controller Shorcut Variables
• wdThis
wdThis es una variable que hace referencia al mismo Web Dynpro. Esto da
acceso a la funcionalidad estándar de WebDynpro como logging, parameter
mapping y validación.
• wdContext
wdContext es la referencia al “controller context root node”.
• wdControllerAPI
wdControllerAPI hace referencia a él API de el actual “controller”.
• wdComponentAPI
wdComponentAPI hace referencia a él “component controller”.

Custom Controllers - Events
• Custom Controller Events

Son usados en tiempo de diseño, manejan la definición y suscripción de
eventos por él desarrollador. Un uso típico es cuando el usuario da un click en
algún botón, a reacción de esto el View Controller termina su procesamiento y
después de lanza el evento, este evento será recibido por los Controllers que
estén subscritos a él. En otras palabras hay un Controller que esta hablando y
otro que esta escuchando y esperando a que algún evento sea lanzado.

Definiendo un Event
• Para crear un nuevo evento, edita el controller y escoge el tab Events. Presionar
el botón New.
• Ingresar el nombre del evento.
• Finalmente definir los parámetros o firma del evento.

Subscripción a un Event
• Subscripción para un evento estáticamente

El campo Even Source y Suscribed Event para el método manejador de
eventos será llenado con el nombre del Controller que dispara el evento.
• Subscripción para un evento dinámicamente
Cualquier método podrá subscribirse al evento dinámicamente.
• Lanzando el evento
Un evento {nev} puede ser lanzado por cualquier método de él controller
contenedor del evento usando el método wdThis.wdFireEvent{Nev}().
View Controllers – Actions and Plugs
• View Controller Actions

Una acción es conceptualmente lo mismo que en un evento, pero con las
siguientes diferencias:
• Una acción puede solo ser definida en el View Controller.
• Una acción {act} es relaciona un evento del lado del cliente a un manejador del
evento onAction {act}.
• Muchos elementos UI pueden lanzar una acción. Ej. Un botón.
• View Controller Navigation Plugs
• Outbound plugs – Un evento de navegación es creado cuando un Outbund plug es
disparado. La declaración en el View Controller es: wdFiredPlug{Npo}().
• Inbound plugs – Un inbound plug es el manejador de evento de navegación que
respondera cuando el evento sea lanzado. La declaración será: onPlug{Npi}.

Actions – Relacionando un evento del browser a un
método del View Controller

Introducción
Debugging

Contenido
• La estructura del Context
• Context Mapping
• Interal Mapping
• External Mapping

Context – El corazón de un Controller
• Context
Cada Web Dynpro Controller (excepto el interface view controller) tiene
exactamente un jerarquía de datos guardada en una estructura conocida
como un context.
• Context estructure
Normalmente la estructura (metadata) de un context será definida en
tiempo de diseño, pero también puede hacerse en tiempo de ejecución.
• Compartiendo datos entre diferentes controllers
La información dentro de un contexto de un custom controller puede
accederse por otro controller (view o custom) por una técnica llamada
context mapping. Este es el mecanismo primario para compartir datos.

The Context Editor
• Context editor
El Context editor es un editor gráfico que permite estructurar el context de
un controller.
Importante: Se debe tener siempre abierto el Properties View cuando se edita el
context porque hay ciertas propiedades que pueden afectar críticamente el context
en tiempo de ejecución.

Definiendo la estructura del context
• Context Structure
Todos los context de los controllers tienen una estructura formada por nodes y
attributes.
• Nodes
Un context node es una abstracción usada dentro del Web Dynpro Framework.
La máxima y mínimo número de elementos dentro de una colección es limitado
a uno.
• Attributes
Un context attribute no puede existir sin un nodo.

Tipos de Context Attributes
• Después de crear un context attribute, este es creado con un tipo string.

• Desde el property view de el attribute, el tipo puede ser cambiado.
• Un número de diccionarios locales son provistos por el WD Framework.

Definiendo Tipos simples en el Diccionario
• Para definir un nuevo tipo en el diccionario, abra el diccionario local.

• Desde el menú del context escoga Simple Type y seleccionar Create Simple
Type.
• Ingrese el nombre del tipo, un paquete y presione Finish.
•

Context Structure – Design Time (1)
• The Context at design time

En tiempo de diseño se crea la estructura dentro de la cuál los datos vivirán.
• Cardinality property
Todo context node tiene una propiedad llamada Cardinality. Describe el máximo y
mínimo número de elementos del nodo en tiempo de ejecución.
• Cardinalidad mínima: 0 o 1
• Cardinalidad máxima: 1 o n
Los cuatro posibles valores de la cardinalidad son:
• 0..1 Cero o un elementos
• 0..n Cero o más elementos
• 1..1 Uno y solo un elemento
• 1..n Uno o más elementos
Context Structure – Runtime (1)
• La propiedad Singleton de un context node

Note que el nodo SalesOrders tiene un nodo hijo llamado LineItems. El LineItems
es un nodo distinto con su propia colección de elementos.
• Node LineItems es un non-singleton (Singleton=false)
Si el nodo LineItems tiene la propiedad Singleton = false, entonces para cada
elemento en el nodo padre (SalesOrders), habrá distintas instancias de
LineItems.

Context Structure – Design Time (2)
• Node LineItems es un singleton (Singleton=true)

El nodo LineItems ahora tiene la propiedad Singleton puesta a true (que es
el default), entonces no importa cuantos elementos estén presentes en el
nodo padre (SalesOrders), porque solo habrá solo una instancia de
LineItems. En otras palabras si el nodo SalesOrders contiene las ordenes
1000, 1001 y 1002; entonces de alguna manera se debe asegurar que
cuando estoy leyendo la orden 1001, este leyendo LineItems para la orden
1001.

Context Mapping
• Context Mapping
Context Mapping permite que un controller (típicamente el view
controller) acceda a datos que han sido procesados por algún otro
controller.
• Data Modeler

Ejercicio 2

Context at Runtime – Accesando a valores del nodo
• Para acceder a los nodos del contexto, simplemente se necesita una
referencia wdContext.node{cn}() donde {cn} es el nombre del nodo del
contexto. Esto regresa un objeto {no} del tipo I{cn}node

Context at Runtime – Accesando a valores del nodo (2)
• Para acceder a atributos individuales del nodo dentro del context nodo, los 3
pasos siguientes deben ser realizados:
• Acceder al nodo relevante de la forma wdContext.node{cn}() donde {cn} es
el nombre del nodo del context node. Esto regresa un {no} de tipo I{cn}Node.
• Obtener una referencia del elemento del nodo seleccionado, de la forma
{no}.current{cn}Element() que regresara un objeto {el} de tipo I{cn}Element.
• Una vez que el elemento correcto ha sido seleccionado, se llama a los
métodos que acceden la información de la forma {el}.get{ca}

Context Node – Accediendo a valores del nodo(3)
• Generalizando el código

Context Node – Creando valores del nodo(1)
• Para añadir un elemento a un nodo se requieren los siguientes tres pasos:

• Acceder al nodo wdContext.node{cn}() donde {n} es el nombre del nodo.
Esto regresa un objeto {no} del tipo I{cn}Node
• Crear un nuevo elemento usando el método {no}.create{cn}Element(). Esto
regresa un objeto {el} de tipo I{cn}Element

Context Node – Creando valores del nodo(2)
• Generalizando

Context Node – Acceso genérico a valores de
elementos del nodo(1)

Context Node – Acceso genérico a valores de
• Generalizando

Context Node – Creación genérica a valores de

Context Node – Creación genérica a valores de
• Generalizando

Ejercicio 3

Introducción
El Context en tiempo de ejecución
Debugging

¿Qué es un elemento UI?
• Un elemento UI es cualquier entidad gráfica que ocupa una posición
dentro del view layout.
• Los elementos UI no necesariamente están visibles en la pantalla.

Categorías de elementos de Interface de Usuario
• Hay numerosos elementos de interface de usuario viables para diseñar la

interface gráfica de una aplicación Web Dynpro.
• Simple Standard elements
Button, Caption, CheckBox, CheckBoxGroup, DropDownByIndex, Image,
DropDownByKey, FileDownload, FileUpload, HorizontalGutter, IFrame, Label,
InputField, LinkToAction, LinkToURL, ProgressIndicator, RadioButton, TextEdit,
RadioButtonGroupByKey, TextView, TimeTrigger, ToolbarButton, ToolbarInputField,
ToolbarDropDownByKey, ToolbarDropDownByIndex, ViewContainerUIElement.
• Complex Standard elements
DateNavigator, PhaseIndicator, RoadMap, TabStrip, Table, Tree
• Container Standard Elements
Group, ScrollContainer, Transparent Cointaner, Tray

Usando de View Editor
Muchos elementos gráficos pueden disparar eventos del lado del cliente.
Estos pueden ser encontrados debajo el Event propertie del nodo, solo es
necesario asociarlo con alguna acción.

Context Binding
• Context Binding es la asociación de una propiedad del elemento UI con un nodo

o atributo. Ej. El valor de un Inputfield, para cambiar el valor del elemento solo es
necesario cambiar el valor del atributo del contexto asociado al control gráfico.

Poniendo data en la pantalla

Container UI elements
• Container UI elements
Son elementos que contienen elementos de interface de
usuario como hijos, entre ellos esta:
• IFrame
• Group
• ViewContainerUIElement
• Tray
• TransparentContainer
• ScrollContainer

FlowLayout layout Manager
• FlowLayout layout manager

• Es el layout por default de todos los elementos de interface de usuario.
• Los elementos de interface de usuario toman posición por si mismo de
izquierda a derecha a través la pantalla.
• FlowLayout layout no es el más útil contenedor de elementos UI.

RowLayout layout manager
• RowLayout layout manager

• Permite a los elementos alinearse en específicos renglones.
• Se puede especificiar que ciertos elementos UI aparezcan al principio
de un nuevo renglón, poniendo layoutData a RowHeadData.

MatrixLayout layout Manager
• MatrixLayout layout manager

• Matrixlayout permite a los elementos de interface de usuario ser
alineados en específicos renglones pro viendo un alineamiento vertical.
• Se puede especificar que cierto elemento UI aparezca al inicio de
cada renglón, poniendo la propiedad layoutData a MatrixHeadData.

GridLayout layout manager
• GridLayout layout manager
• GridLayout permite a los elementos de interface de usuario alinearse
dentro de un grid en el cuál siempre hay un número igual de columnas por
renglón.
• Una vez se especifique el número de columnas los elementos serán
añadidos de izquierda a derecha.
Si cambia el número de columnas a 3 automáticamente se regenera la pantalla.

Table UI Element
• Table
Table es un elemento más complejo que tiene como hijos más elementos,
entre los cuales están Table Column, Table CellEditor, etc.

Binding a Table UI element to the context

Binding a Table UI element to the context
• TableColumn
Los elementos de TableColumn deben ser referenciados a los
atributos del nodo. Este elemento tiene su propio elemento Caption para
poner la etiqueta del encabezado de las columnas.

Seleccionando múltiples renglones de una tabla
• Múltiple selección de renglones en una tabla

Para permitir múltiple selección en una tabla se debe cambiar la
cardinalidad del nodo del contexto a 0..n o 1..n

Ejercicio 4

Introducción
Debugging

Internationalization
• Internationalization
• Permite a él mismo programa operar en múltiples lenguajes sin
necesidad de tener diferentes versiones de el código para cada
lenguaje.

XLIFF estándar
• El lenguaje XML Language Interchange File Format (XLIFF) es un estándar por
el cuál puede ser guardado especifico lenguaje de texto.
• Todos los textos especificos de cada lenguaje son guardados en .xlf archivos
dentro src/packages/{pckn}/../{pck1}.
• El lenguaje que los textos asumen por default es el declarado cuando se crea
el proyecto.

Language specific text within Web Dynpro
• En el Navigator View, localiza todo los archivos .xlf bajo el directorio

src/packages/{pckn}/…/{pck1}
• Usando el context menu copiar y pegar cada archivo asegurándose de
renombrar el archivo correctamente. Si {file}.xlf es el nombre del archivo del
lenguaje del proyecto a {iso} indica el código ISO para el lenguaje o dialecto
requerido, entonces la regla para los nombres de los archivos es:
{file}.xlf -> {file}_{iso}.xlf
• Finalmente, hacer un rebuild al Web Dynpro Project y crear el archivo.

Runtime Local Identification
• Determinando el texto especifico en el lenguaje requerido

Message Editor
• Message Editor
El Message Editor crea 4 tipos de mensajes – Standard, Warning, Error
y Text. Los tres primeros son usados para suplir información a la pantalla en la
forma de mensajes.
Cualquier mensaje declarado creara una constante Java Imessage{nc}

Imprimiendo mensajes en pantalla
• Default Message Area

Por default los mensajes aparecen como una tabla en la parte inferior
izquierda de la pantalla.
• Message Area UI Element
Se puede agregar un Message Area UI Element en cualquier parte del View,
esto marcará la posición en la cuál los mensajes aparecerán.

Web Dynpro Messages

Ejercicio 5

Introducción
Mensajes y Soporte a Mensajes
Debugging

Tres tipos de Value Help(1)
• Simple Value Selector
Simple Value Selector (SVS), es el nombre dado
a un drop down list box que desplega un
conjunto de valores. SVS es útil para valores
pequeños, como máximo 30.
• Extended Value Selector
Si el número de entradas en un drop down list
box llega a ser muy grande entonces Extended
Value Selector (EVS) es lo recomendable. EVS
provee funcionalidad sort y search.
• Generic UI Services
El ambiente Web Dynpro provee servicios
genéricos UI el desarrollo. Por ejemplo: para
países, código postales.

Tres tipos de Value Help(2)
Object Value Selector (OVS)
En algunas ocasiones es necesario

buscar objetos en vez de valores. Por
ejemplo: El usuario requiere ingresar el ID
del cliente, dependiendo de este criterio de
búsqueda, la pantalla mostrara los
resultados de la búsqueda.
Este control requiere que el desarrollador

escriba algún código especifico.

Simple Value Selector
1. Crear un simple tipo en el diccionario conteniendo una enumeration.

2. Crear un context attribute de este simple tipo.
3. Llenar la propiedad selected key de un DropDownByKey.

Extended Value Selector
1. Crear un simple tipo en el diccionario conteniendo una enumeration.

2. Crear un context attribute de este simple tipo.
3. Llenar la propiedad value de un InputField.

Dynamic Extended Value Selector
1. Crear un context attribute de tipo string.

2. Llenar la propiedad value de un InputField.
3. Implementar el código mostrado en la siguiente lámina.


Ejercicio 6

Introducción
Debbuging

Switching on Debug Mode
• Usar el J2EE Engine View en NWDS

1. Seleccionar el server node.
2. Dar click en el botón derecho
3. Seleccionar “Enable debugging of process”.

Switching on the display of line numbers
1. Seleccionar
“Preferences option”
del Window Menu.
2. Expander la rama
“Java” y seleccionar
“Editor”
3. Verificar que este
activado “Show line
numbers”

Poner un Breakpoint
1. Abrir la implementación de cualquier controller.

2. Dar doble click en el margen de la izquierda del código.
3. El breakpoint será fijado con una línea sobresalteada.

Definiendo la configuración de Debug y el punto de
comienzo para la sesión de Debug
1. Seleccionar Run -> Debbug en el menú.

2. Seleccionar Web Dynpro Application y seleccionar New.
3. Debajo de Name ingrese el texto que identifica la configuración de debugging.
4. Seleccionar Browse y seleccionar el nombre del proyecto a hacer debugging.
5. Si la aplicación no ha sido deployada en el servidor, seleccionar Create and
deploy.
6. Presionar el Apply.
Debug Perspective
• The debugging perspective

Una vez iniciado el proceso de debugging , Eclipse abrira la perspectiva de debugging.
• Debug View - Despliega el stack de los threads del programa.
• Editor View – Mostrara la línea de ejecución del progarma.
• Variables View – Muestra el valor de las variables en el tiempo x.

Debug View: Step Execution
• Step Info (F5) Ejecuta la siguiente línea de código.

• Step Over (F6) Ejecuta la línea de código sin entrar a llamadas de métodos.
• Step Out (F7) Sale del método que se esta ejecutando y regresa al punto donde fue
llamado.
• Resume (F8) La aplicación continua la ejecución y cierra la sesión de debbugging.
• Suspend Pausa la ejecución y permite ver el estado de las variables.
• Terminate Termina la ejecución del programa.

Variables View
• Variables View
Permite cambiar los valores de las variables.

Terminando la sesión de Debugging
1. En Debug View, llamar al nodo más alto (<Configuration Name>[Web

dynpro]).
2. Escoger Terminate.
3. Escoger Remove All Terminated

Restarting a debug session

Introducción
Debugging

Dynamic Runtime Modifications

Dynamic Runtime Modifications

Dynamic Value Node Creation

Dynamic Value Node Creation(1)





Principios para crear un nodo dinámicamente
• Cuando se crea un nodo del contexto en tiempo de ejecución, se deben seguir

los siguientes pasos:
1. Obtener una referencia a el nodo padre. En otras palabras llamar a

wdContext.getChildNode( (“{cn}”,int).
2. Con la instancia del nodo obtenido en el paso 1, llamar el método
getNodeInfo().
3. Llamar el método addChild() del nodo padre.

Introducción
Debugging

• Contenido
• Invocación remota de la funcionalidad ABAP.
• El manejo y creación de Adaptive RFC (aRFC) model objects.
• El uso a RFC model objects.
• Configuración del SLD y JCo Connections.

Interface de Arquitectura RFC
• The SAP Enterprise Connector crea un proxy en tiempo de diseño.

• Todos los programas externos que deseen invocar alguna funcionalidad dentro de
un SAP System deberán usar RFC.

Interface de Arquitectura RFC(2)
• Adaptive RFC fue desarrollada para simplificar e implementar

totalmente, la funcionalidad de JCo.
• Cada vez que RFC es llamado en un sistema SAP, la metadata (definición)
de la interface es verificada por cambios.
• Si la interface ha sido cambiada desde la última invocación la aplicación
checa el diccionario por cambios y reaccionar apropiadamente.
• aRFC es automáticamente actualiza el diccionario por cambios en la
metadata (definición), para reaccionar adecuadamente.

Aprovechamientos de Adaptive RFC
• aRFC puede adaptarse a la adición de nuevos campos en una existente

estructura de interface
Cualquier módulo de funciones liberada por SAP es hecha a través de
una estructura .APPEND que puede también ser extendida por el cliente.
Si este tipo de interface cambia el Adaptive RFC (aRFC) puede
reaccionar, y cambiar la definición (metadata) en tiempo de ejecución.
• La aplicación Web Dynpro debe checar por cambios en la metadata
Si se requiere que la aplicación reaccione a cambios para nueva metada
suplida por aRFC en tiempo de diseño, entonces se debe construir una
aplicación para checar por estos cambios.
• aRFC puede adaptarse a la adición de nuevos campos dentro de una
estructura existente, pero no puede adaptarse a la adición de nuevas
estructuras.

La interface de un módulo de funciones ABAP
• Todos los módulos de funciones ABAP tienen la siguiente interface:

• Import Parameters – Escalar o estructura de parámetros de entrada, tiene
una cardinalidad de 0..1.
• Export Parameters – Escalar o estructura de parámetros de salida, tiene
una cardinalidad de 0..1.
• Changing Parameters – Escalar o estructura de parámetros de entrada y
salida. Tiene una cardinalidad de 0..1. RFC no usa parámetros CHANGING.
• Tables – Estructuras de parámetros de entrada y salida con cardinalida 0..n.
• Exceptions – Textos que identifican una terminación inesperada dentro del
módulo de funciones.

¿Qué es una BAPI?
• En 1996 SAP Introduce el concepto de Business Application Programming

Interface (BAPI).
• Una BAPI es un módulo de función. Una BAPI debe:
1. Tener un nombre que empiece por BAPI_
2. Implementar el método de un SAP Business Object.
3. Mantener una interface estática a través de diferentes versiones del sistema.
4. Ser remoto. Habilitar el flag de “Remote”.
5. Correr sin la necesidad de interacción con el usuario. Si la BAPI requiere
cualquier pantalla de SAPGUI, la conexión RFC terminara inmediatamente.
6. Manejar errores.
7. No causar que la sesión de ABAP cambie.

Requerimientos mínimos de SAP
Las habilidades que necesita un desarrollador Web Dynpro son mínimos para
usar una interface aRFC. Solo se requiere:
• Logearse dentro un sistema SAP.
• Usar la transacción SE37 (Function Module Builder) para:
• Examinar la interface del módulo de función.
• Correr el módulo de función con los apropiados datos de test.
• Examinar la salida después de la ejecución del módulo de función.
• Usar la transacción SE11 (ABAP Dictionary) para examinar la estructura de los
parámetros de entrada o salida.
• Usar la transacción SE16 (Data Browser) para desplegar los contenidos de un
tabla de base de datos.

Creación de un aRFC Model

Creación de un aRFC Model(2)

Principios para crear un nodo dinámicamente
• Logical System Names son nombres que pueden ser el nombre

deseado y deben ser nombrados de acuerdo al tipo de información de
negocio que ellas proveerán.
• Ejemplo: Si se desea llamar a un módulo de funciones HR Payroll en
el sistema DEV, entonces HR_PAYROLL_DATA y
HR_PAYROLL_METADATA

• Como para SAP GUI de Windows, la información desplegada por el Drop

Down en el Load Balancing tab es obtenida del archivo saplogon.ini, el cuál
es localizado en el directorio Windows.

• Esta pantalla de inicio aparecerá vacía

Ya que SAP contiene 9500 módulos de funciones remotos, en esta
pantalla primero se deberá filtrar la información.

• Una vez que la importación haya

finalizado, usted vera el Import
Log.
• Si la interface del módulo de
funciones remoto cambia durante
el desarrollo, se deberá reimportar
el modelo y usted vera los cambios
en el Import Log.

¿Qué tiene el modelo aRFC creado?

Java Dictionary Structures
Java Dictionary Structures tienen el mismo nombre como su correspondiente

estrucutra en ABAP

The Model Class Hierarchy(1)

• Scalar Parameters
Un parámetro escalar es cualquier valor que describa un
simple campo. Estos no son desplegados directamente, sino que hay
dar doble click para desplegarlos.


• Bi-directional parameters
Dado el hecho de los parámetros CHANGING y TABLES es necesario
preservar una imagen de estos parámetros en los parámetros de
“input” y “output”.

Model object managment: SAP Recommendations
• DCs son normalmente construidos con SAP Java Development

Infrastructure (JDI).

Model object managment: SAP Recommendations(2)

• Para agregar un proyecto Web Dynpro a la parte pública de un DC, escoger

Add to public part desde el context menu.

• Es importante, que una vez hecho contruido el DC´s, se debe hacer “build” de
el DC. Esto proceso es diferente a el Rebuild Project. Cada parte pública se
convierte en archivo JAR, y proceso de DC Build reconstruye las partes
públicas.

Context Model Nodes
• Un Context Model Node es un
nodo que obtiene la metadata
desde el objeto model.
• Un Context Model Node debe
ser ligado a un model obejct para
poder hacerlo reusable.

Binding a context model node
• Un Context Model Node debe ligarse a un model object usando el Data

Modeller Tool, o manualmente seleccionando Edito Model Binding.

Arquitectura general para una invocación RFM
• Se transporta la data desde el Model a los elementos de interface de usuario

haciendo mapping y binding.

Usando Model Object en tiempo de ejecución

Usando Model Object en tiempo de ejecución(2)

Configurando SLD y JCo Connections
Importando y desplegando el catálogo de Software
• Importar el catalogo de software es el primer paso en configurar el sistema SLD.

El catalogo de software contiene toda la información técnica de todos los posibles
productos de SAP y componentes de software.
• Para revisar la información técnica y si existe el sistema al cuál se quiere conectar
se necesita consultar el catalogo SLD en: http://host:port/sld ->Software Catalog
• Si producto o componente de SAP no existe, se deberá exportar el nuevo catalogo
de: http://host:port/sld -> Administration -> Content Import -> Browse

Defining Technical Systems
• Un Technical System es un objeto lógico, que contiene toda la metadata

(definición) de un cierto sistema SAP, como el ID del sistema, nombres de
servidores, logon group, etc.
• Para definir un Technical System, abrir la siguiente página:
http://<host>:<port/sld -> Technical System

Defining Technical Systems(2)
• Procedimiento
1. En la primera pantalla presione New Technical System
2. Seleccionar Web AS ABAP y presione Next
3. Ingrese el SID de el sistema SAP, el número de instalación y el nombre
del host DB. El número de instalación puede ser encontrado ingresando
al sistema SAP y en el menú seleccionar System -> Status
• Procedimiento
1. Ingrese el Message Server host, instance number, message server
port y logon groups.
2. Presionar Next.
3. En la siguiente pantalla puede añadir nombre de servidores y número
de instancia. Presionar Next.

• Procedimiento
• Seleccionar el producto, describiendo el sistema SAP.
• Presionar Finish.

Defining Logical System Names(1)
• El System Landscape Directory (SLD) debe ser arrancado y configurado.

• Arrancar el Web Dynpro Content Administrator,ingresando la URL
http://<host>:<port>/webdynpro/welcome -> Content Administraror
• Se debe tener autoridad de administrador para realizar esta tarea.

• Todos los destinos JCo deployados aparecen en esta lista.

• Los iconos rojos indican que la conexión JCo es requerida por una aplicación y no
ha sido definida.
• Crear el link nombrado Create.

• Paso 1
Ingresar el Client del sistema SAP.
Presionar Next.
• Maximum Pool Size: Determina cuantas conexiones deben abrirse para el actual
usuario. Incrementar este valor incrementar el tiempo para obtener una conexión.
• Maximum Connections: Máximo número de conexiones por usuario.
• Connection TimeOut: Define cuanto tiempo (en segundos) permanezca viva una
conexión después de usarla.
• Paso 2
• Seleccionar el servidor J2EE para el cuál se requiere la conexión JCo.
• Presionar Next.
• Paso 3
• Seleccionar el tipo de conexión – Application Data o Dictionary Meta Data

• Paso 4
• Seleccionar Server y/o Logon Groups, para revisar Logon Groups
cheque la transacción SMLG.
• Presionar Next.

• Paso 5
• Si selecciono Application Data, se tendrá cuatro escenarios de
autentificación, se debe usar la adecuada, para temas de desarrollo se
deberá usar User/Password.
Para el caso de Dictionary Data solo podrá seleccionarse
User/Password.
• Presionar Next.

GRACIAS

Curso de Web-Dynpro

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Curso de Web-Dynpro

Uploaded by

Copyright:

Available Formats

Programa de Capacitación

SAP Web Dynpro

Josué David Cruz Soriano

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Proveer una integrada y

• Cubrir el ciclo completo de proyectos Java.

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• La interface de usuario (Perspective, Views, Editor)

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• SAP NetWeaver Developer Studio está basado en la plataforma libre

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

4. Dar clic en el botón “Siguiente”

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

5. Escoger la ruta y el lugar de instalación y dar clic en el botón

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

6. Seleccionar “SAP Netweaver Developer Studio” y dar clic en el

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

7. Dar clic en el botón “Install”.

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

8. Seleccionar la ruta del JDK de Java y dar clic en el botón

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

9. Al finalizar la instalación dar clic en el botón “Terminar”.

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• El principal objetivo de Web Dynpro es habilitar

– Minimiza código, maximiza el diseño.

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• La arquitectura de Web Dynpro puede ser dividida en cuatro cuadrantes:

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• The Component Interface

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• Una aplicación Web Dynpro es el único punto de entrada a un Web Dynpro

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• El nodo root de un Web Dynpro Project representa una unidad deployable de

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• Web Dynpro Component Interfaces

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• Custom Controllers – Son usados para encapsular unidades de funcionalidad

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• Un window es el conjunto de todas las posibles vistas que pueden ser

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• Web Dynpro Models

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

• Standard hook methods

• Events and events handlers

• Actions and plugs

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados

Confidencial - MVM Ingeniería de Software S.A., todos los derechos reservados