WebDynpro & UI5

Why Choose?

Tom Van Doorslaer

@TomVanDoo

Ctac Belgium

Legal disclaimer
The information in this presentation is confidential and proprietary to SAP and may not be disclosed without the permission of SAP. This presentation is not subject to your license

u
o
y

agreement or any other service or subscription agreement with SAP. SAP has no obligation to pursue any course of business outlined in this document or any related presentation, or to
develop or release any functionality mentioned therein. This document, or any related presentation and SAP's strategy and possible future developments, products and or platforms

ll
e
t

directions and functionality are all subject to change and may be changed by SAP at any time for any reason without notice. The information in this document is not a commitment,

I
!
g
e
i
n
l
i
h
a
t
y
e
r
b
e
v
d
l
E
u
Co

promise or legal obligation to deliver any material, code or functionality. This document is provided without a warranty of any kind, either express or implied, including but not limited to,
the implied warranties of merchantability, fitness for a particular purpose, or non-infringement. This document is for informational purposes and may not be incorporated into a contract.
SAP assumes no responsibility for errors or omissions in this document, except if such damages were caused by SAPs willful misconduct or gross negligence.

All forward-looking statements are subject to various risks and uncertainties that could cause actual results to differ materially from expectations. Readers are cautioned not to place
undue reliance on these forward-looking statements, which speak only as of their dates, and they should not be relied upon in making purchasing decisions.

Cockpit

Sidepanel

Custom
theme

Why Choose?

Agenda

Cockpits

Building Cockpits
Using FPM, or Page Builder

How?

Check out some of the frameworks

FPM
Start FPM application FPM_WD to get you going

Page builder
WDR_CHIP_PAGE
Check the blog

Cockpits

Sidepanels are easy

How?

Page builder + chip + simple webdynpros

WDR_CHIP_PAGE
Condensed blog contains all the info

Cockpits

Custom Themes are cool

Especially with the addition of CSS Class element

New css class property on all elements as from UI addon SP8

Add those CSS classes in your custom theme

Transaction /UI5/THEME_DESIGNER

Next step

Now its still a custom shell

I want to enhance the FPM_OIF_COMPONENT to look like that
And support search events
And runtime configuration buttons
And ...

Why Choose?

SAPUI5 on WebDynpro,

could that be possible?

HTML islands

UI5 IN WDA is already possible with HTML islands

FPMGB_TEST_OVP_CAROUSEL_UIBB

Server-side vs service based

WebDynpro uses a Context to interchange data

UI5 uses REST services to interchange data
Theres no reason why the context cant be exposed as a JSON
service
Which can be persisted offline!

Technical information

Package: SWDP_*

Architecture

Webdynpro uses MVC

So does UI5
Component
Controller
View:
Layout
Controller

Application for navigation purposes (sounds like a window)

Index.html <-> more or less your Webdynpro application

Views

Webdynpro uses view definition

So does UI5 (XML defined views)
Which makes me wonder:
Could we use UI5 element instead of webdynpro?

Officially, custom WD UI elements are not supported

But...

UI Libraries

Ever noticed how WebDynpro has multiple element categories?

libraries

Theres also multiple UI libraries

Libraries

You can add your own library

elements

And elements

UI elements

Theres even a tool to generate all classes for your UI elements

Elements JS

Element renderer

How the HTML is comprised

Hobby project anyone?

Now its all just in my head

In theory
Maybe next year Ill have something to show

Tom Van Doorslaer

@TomVanDoo

Ctac Belgium