Beruflich Dokumente
Kultur Dokumente
Web Dynpro Basics NetWeaver Developer Studio first Exercise Netweaver Development Infrastructure Using Webservices with Web Dynpro Web Dynpro Applications inside the Enterprise Portal
Web Dynpro
Web Dynpro is the standard programming model for building SAP NetWeaver user interfaces (UIs).
Web Dynpro Pattern Web Dynpro Foundation Business Blueprint Pattern (BSP) HTML Business for Java (HTMLB) Business Server Pages (BSP) UIs ITS Technology (SAP GUI, Flow Logic) ABAP UIs 1991 ... ITS UIs (Web GUI, IACs)
NetWeaver 04
...
The Web Dynpro Runtime Environment is placed into the Web Dynpro Container part of the SAP J2EE Engine All Web Dynpro Projects (Deployable Objects, Web Dynpro Development Components) containing running Applications are deployed into this Web Dynpro Container
Master Data Management PROCESS INTEGRATION Integration Broker Bus. Process Management
APPLICATION PLATFORM
ABAP
DB and OS Abstraction
...
SAP AG 2005, Web Dynpro Product Management / 5
Achieve Independence...
from platform from UI technology
Easy integration into SAP Enterprise Portal Sophisticated business Web applications Efficient tools within SAP NetWeaver Developer Studio Performant user-interface development services Platform-independent metadata generation
Adapt Portal theme for Web Dynpro application The user-interface technology for SAP EP Wizards and graphical tools Integration into SAP Web AS Declarative programming
Model-View-Controller Architecture
Model : encapsulates the business logic and persistence View: View defines certain part of the User Interface Controller: Controller handles events, updates the model, shows next view
Generic UI-Services
Valuehelp, Message Management based on datatype information
Reusable Components
Construct Web Applications from Patterns
Controller
Defines application data Usually connected to business functionality
Model
Response
View
Browser
Web Dynpro Client
mySAP.com Backend
http
Input Data + Action
Model
View
View Controller
View
View Controller
Component Controller
Model Interface
Model
View
View Controller
Custom Controller
View
Layout UIElements Nested Views
View Controller
Coding
Component Controller
Coding Model Interface
Context
Model Data Global Data
Context
Model Data Global Data Model Data
Navigation Links
Local Data
View
Layout UIElements Nested Views
View Controller
Coding
Component Controller
Coding Model Interface
Context
Model Data Global Data
Context
Model Data Global Data Model Data
Navigation Links
Local Data
View
Layout UIElements Nested Views
View Controller
Coding
Component Controller
Coding Model Interface
Context
Model Data Global Data
Context
Model Data Global Data Model Data
Navigation Links
Local Data
Context Mapping
View
Layout UIElements Nested Views
View Controller
Coding
Component Controller
Coding Model Interface
Context
Model Data Global Data
Context
Model Data Global Data Model Data
Model Binding
Navigation Links
Local Data
Layout
Controls
Context
bind
MasterViewContext
ing
Opportunities Goals ... Products Category Product ID Quantity ... Valuation ...
MasterView
con tex t
ma ppi ng
CustomContext
Sales ... Opportunities Goals ... Products Category Product ID Quantity ... Valuation ... ...
DetailView DetailViewContext
Products Category Product ID Quantity ...
View
View Controller
Model Interface
Model
View
View
Component Controller
Custom Controller
View Controller
Controllers
Component Controllers
Default controller inside every Web Dynpro Component: own context, events, public methods
Custom Controllers
Additional controller for encapsulating separate logic. A Component Controller can be seen as the default Custom Controller.
View Controllers
Controller for every view with own context, public methods, plugeventhandlers, action-eventhandlers managing user interaction.
SAP AG 2005, Web Dynpro Product Management / 23
Web Dynpro Basics NetWeaver Developer Studio first Exercise Netweaver Development Infrastructure Using Webservices with Web Dynpro Web Dynpro Applications inside the Enterprise Portal
J2EE Tools
Infrastructure Tools
Persistence Tools
J2SE Tools
Order of all opened perspectives can be changed afterwards Choose your favorite perspectives via Preferences Workbench Window Perspective
Close single file Doubleclicking the toolbar adapts the size of any view to screen size, and back !
Close view
Select Perspective
XML Editor
Preview
Data Modeler
Double click or Choose Open Data Modeler from the context menu
Navigation Modeler
Double click or Choose Open Navigation Modeler from the context menu
View Designer
Make the Properties View visible to show the properties of the selected Context elements.
Controller/Context Editor
Make the Properties View visible to show the properties of the selected Context elements.
Message Editor
Web Dynpro Basics NetWeaver Developer Studio first Exercise Netweaver Development Infrastructure Using Webservices with Web Dynpro Web Dynpro Applications inside the Enterprise Portal
2 Views: Simple input form view together with a confirmation view Navigation: User can navigate between both iews Shared Data: Both views have to share the entered name of the user. This is done via Context Mapping.
Component Controller
Controller B
declared Controller Usage between controllers A and B View Controller 1 View Controller 2
Controller Context
C o n t r o l l e r
Component Context
Name
View 1 Context
Name
Context Mapping
referenced values
View 2 Context
Map value attributes Name from view contexts to value attribute Name in the component context Bind text property of UI element to the view contexts value attribute Name The entered name John is stored in a component contexts value attribute. mapped attributes reference this value.
Name
V i e w
Data Binding
John
InputField
John
TextView
Context Mapping
Reuse of previously defined attributes and nodes from other contexts. Done by defining attribute and/or node mappings from one context to another. Advantage: Advantage reduction of complexity as well as reducing a context's scope to the minimal set of data required to fulfill a task
SAP AG 2005, Web Dynpro Product Management / 48
Context Mapping
For sharing context data between two view controllers a Custom or Component Controller is needed, storing e.g. the original context value attribute. The view controllers context attributes are mapped to the custom controllers one. A corresponding Controller Usage (of the custom controller) has to be set in both view controllers via IDE. Based on reference semantics (only one original context structure is stored).
Action
Event Handler public void onActionSave(IWDCustomEvent wdEvent) { //@@begin onActionSave(ServerEvent) saveProductDetails(wdContext.currentProdDetailsElement()); wdThis.wdFirePlugDataHasBeenSaved(); //@@end Custom coding! }
Navigation
Principle Navigation between two views A and B can easily be done by the following three steps:
defining a Navigational Link from Outbound Plug of view A to Inbound Plug of view B defining an Action Event triggering the navigation fireing the defined Outbound Plug in the view controllers corresponding event handler wdThis.wdFirePlugToResultView();
Developing the QuickStart Application Open Document Creating Your First WebDynpro Application
in temp/WebDynpro/sampleapps/ WebDynpro_QuickStart_Tutorial_en.pdf
You have 45 minutes for developing the Welcome Web Dynpro application
Web Dynpro Basics NetWeaver Developer Studio first Exercise Netweaver Development Infrastructure Using Webservices with Web Dynpro Web Dynpro Applications inside the Enterprise Portal
Development environment
SAP AG 2005, Web Dynpro Product Management / 54
Component Model
Products
Collection of various software components Product version
* *
SC version 1 1 0/1 Release
*
DC version 1
Development Objects
Are saved as versioned files in the DTR
*
File version
Development Components
Development Components (DCs)
Container for development objects Build unit
DC B DC C
Nested DCs
DCs can be nested within each other (restricted access) usage dependency usage dependency
Public parts
Part of a DC that can be used by other DCs (DC interfacing)
Usage dependencies
Indicates that a DC part can be used by other DCs (during the build process or during the runtime)
J2EE Server
Developer's PC
CentralJ2EE server
Deploy
Check-in changes
J2EE Server
Component Build
Activate
OK?
Deploy archives
Web Dynpro Basics NetWeaver Developer Studio first Exercise Netweaver Development Infrastructure Using Webservices with Web Dynpro Web Dynpro Applications inside the Enterprise Portal
What
A portType describes the abstract interface (Web service type) of the Web service Each contained operation can have an input, an output and a number of fault messages Different Messages are build from build-in or custom data types Data types are defined using XML Schema
How
A binding specifies exactly one protocol for the operations of a portType
Where
A port defines the Web service endpoint by specifying a single network address
UDDI Overview
Universal Description, Discovery and Integration (UDDI) Describes how to advertise and discover a Web service
Differentiates Web service provider, Web service and Web service type Holds metadata that can be used to search for services (names, IDs, categories, types, etc.) Specifies the interface for Web service registries
HTTP, SMTP,
SOAP
Service Requestor
Read WSDL
UDDI
Tool 2
Generate
3
Web Service Application
SOAP Client Proxy
Implement
calls 4
Client Application
Web Dynpro Basics NetWeaver Developer Studio first Exercise Netweaver Development Infrastructure Using Webservices with Web Dynpro Web Dynpro Applications inside the Enterprise Portal
Top-Level Navigation
My My iViews iViews
My My Page Page
SAP AG 2005, Web Dynpro Product Management / 68
SAP Design
Theme Editor
Usage:
firing Events: WDPortalEventing.fire("namespace","event","parameter=valu e"); subscribing to Events: WDPortalEventing.subscribe("namespace","event",wdThis.wdG etPortalEventAction()); unsubscribing from Events: WDPortalEventing.unsubscribe("namespace","event",wdThis.w dGetPortalEventAction());
WorkProtect Mode
2 1
Web Dynpro applications can use the Work Protect mode to prevent, that unsaved data inside the Web Dynpro application is lost, if the user navigates to another portal page.
SAP AG 2005, Web Dynpro Product Management / 72
Actions show up
Further Information
Public Web:
www.sap.com SAP Developer Network: sdn.sap.com SAP Customer Services Network: www.sap.com/services/