*Manoj Dhir*ABAP - Web DynproAn Overview by Manoj Dhir.

Manoj Dhir

*Manoj Dhir*Introduction This presentation will be a starter package for all who are and want to be a part of new age SAP UI development and moreover are here to make a change..

Manoj Dhir

*Manoj Dhir*Before I share the Agenda..Who is a developer ?What can we call a good UI ?What do you thing ABAP - Web Dynpro is ?What is the take away you expect after this course?

Manoj Dhir

*Manoj Dhir*AgendaWeb Dynpro The Motivation

Web Dynpro ABAP The Programming Model2.1.Views and UI Elements2.2.Controllers and Context2.3.Navigation and Plugs2.4.Component Usage

Web Dynpro Features3.1.ALV 3.2.Object Value SelectorLets Wrap up. Anyone?Any Questions ?Ok! Can I ask now?

Manoj Dhir

*Manoj Dhir*Objectives of Web Dynpro Model-based UI developmentEnforce clear separation between UI logic and business logicLittle coding, lots of designDeclarative UI developmentFuture Proof UI DeclarationBrowser, Web Dynpro Client, Mobile Device,Client technology independent UI definitionCentral implementation of user interface standardsAccessibility supportAdobe Forms integrationCentrally provided UI elementsInternationalization supportSupports major platformsJava (as of SAP NetWeaver '04), ABAP (as of SAP NetWeaver 7.0)

Manoj Dhir

*Manoj Dhir*Motivation Web DynproWeb DynproUI definition independent of client technology As much abstract declaration as possibleDifferent rendering engines for different (future) UI technologies without adapting application coding

Manoj Dhir

*Manoj Dhir*Application Scenarios With Web DynproJ2EE Web Dynpro RuntimeWeb Dynpro AppWeb Dynpro AppSAP NetWeaver PortalSAP NetWeaver Developer StudioABAP Web Dynpro RuntimeWeb Dynpro AppWeb Dynpro AppABAP WorkbenchJ2EE ServerBackend ApplicationABAP ServerRMIRFC, WSBusiness DataBusiness DataBusiness API (BAPI, Web Services)EJB (e.a.)Web Dynpro iViewWeb Dynpro iViewNetWeaver Business Client

Manoj Dhir

*Manoj Dhir*Come to the point -The DevelopmentDevelopment completely integrated into ABAP WorkbenchGraphical View Layout designDeclarative UI developmentABAP editor with forward navigationABAP dictionary data types directly availableSimple remote debuggingFunctionality and services of the ABAP environment directly usable ABAP lifecycle managementTransportTranslationEnhancements

Manoj Dhir

*Manoj Dhir*Meta-Model Declarations and Custom CodingMeta-model DeclarationsGuarantees common app. design Good for graphical tool supportScreen Layout and NestingNavigation and Error HandlingData FlowComponentization...

Custom Coding Guarantees universality Good for data-driven, dynamic appsImplementation of business rulesDynamic screen modificationsAccess to services (files etc.)Portal eventing...Web DynproToolsGenerated Code GeneratorMeta-dataCompilerRun able AppCustom Code

Manoj Dhir

*Manoj Dhir*Model View Controller (MVC)User Interaction LayerBusiness Interaction LayerBinding LayerVisualizes the application data without caring how it was generated.Generates the application data without caring how it will be displayed.Binds the user and business interaction layers together. All intermediate processing is performed here.ModelViewController

Manoj Dhir

*Manoj Dhir*Defining View LayoutUI element librariesProperties of selected UI elementUI element tree of viewView layout

Manoj Dhir

*Manoj Dhir*UI Element CategoriesEach UI element object is represented as an abstract class that is independent of any client presentation layer.

Manoj Dhir

*Manoj Dhir*Lets Wrap up. Anyone?Web Dynpro is SAPs UI strategyDeclarative, MVC based UI programming modelUI definition independent of rendering technologyWeb Dynpro for ABAP available with SAP NetWeaver 7.0Programming model similar to Web Dynpro for JavaCompletely Integrated into the SAP NetWeaver Application Server ABAP

Manoj Dhir

*Manoj Dhir*Any Questions ?

Manoj Dhir

*Manoj Dhir*Thank you !

Can I ask ?

Manoj Dhir

*Manoj Dhir*Where to Get More Informationwww.sap.com

Manoj Dhir

*UI development should be independent of rendering technology:developer should just think about UI design and not worry about HTTP request/response cyclesNo HTML or JavaScript code part of UI definition no need to care about browser platform, not even if the client is a web browser at allWhole UI definition (layout, eventing, data binding,...) stored in format independent of client technologyallows rendering for different UI technologies: browsers, rich clients, future technologies clientsin case of future UI technology paradigms (WWW forever?) the application UI should still be usable without redesigning

*Forward Navigation is possible in Web Dynpro, however objects cannot be created using forward navigation

*Metamodel Concept and Declarative Programming A Web Dynpro application is developed using a declarative programming approach. Within the ABAP Workbench there are special tools that allow you to build and abstract representation of your application in the form of a Web Dynpro metamodel. The necessary source code is then generated automatically and conforms to a standard architecture known as the Web Dynpro Framework (WDF).The WDF allows each controller within a component to have a set of standard hook methods. It is within these hook methods that any required custom coding can be placed.In addition to the events provided by the WDF, you can also define your own events for a Web Dynpro application.All Web Dynpro applications are constructed from the same basic units. However, through the use of custom coding in the standard hook methods, the standard framework can be extended to supply any required business functionality.Not all implementation decisions need to be made at design time. It is perfectly possible to implement a Web Dynpro application in which the appearance of the user interface is decided at runtime. This allows a highly flexible application to be written without requiring the need to directly write any HTML or JavaScript.

*The roots of Web Dynpro Model-View-Controller SAPs Web Dynpro is built on the foundation of the Model-View-Controller (MVC) design paradigm.MVC was a revolutionary design paradigm because it was the first to describe software components in terms of:The functional responsibilities each should fulfil.The message protocols to which each component should respond.SAP has modified and extended the original MVC specification in order to create the Web Dynpro toolset.

*UI elements are provided in several UI element libraries on the left hand sideThe hierarchy of the UI elements can be seen and changed in the UI element hierarchy at the top right of the workbench.A view layout is defined by placing UI elements on the view via drag and drop or changing the UI element hierarchy directly.Properties of a selected UI element can be defined at the lower right cornerVisible UI elements can be arranged by container UI elements (transparent container, tray,) with specific layout properties (Matrix, Flow Layout,)

*What has been extended from standard MVC in Web Dynpro ?