Download as txt, pdf, or txt
Download as txt, pdf, or txt
You are on page 1of 4

Today's Topics:

-------------------------------
SAP Fiori App Development
Navigating through Help Documentation for SAP Ui5/FIORI
Different Types of Templates
SAP Fiori Worklist Template
SAP Fiori Master Details Template

_______________________________________________________

SAP Fiori App Development:


____________________________

To develop SAP FIORI Like Application : As a developer we make use of

SAP Ui5 Framework


+
SAP Fiori Templates
/
SAP Fiori Elements
+
OData Services
______________________________________________________________________

SAP Ui5 Framework :


--------------------------------

SAP Ui5 Framework is collection of Libraries

Each Library contains Collection of Classes

Each Class Contains "Properties" + "Methods" + "Events"

List of Libraries Used in SAP Fiori Apps:


--------------------------------------------------------------

sap.m (base / default library )


sap.ui.core
sap.ui.model
sap.ui.layout
sap.ui.layout.form
sap.suite.ui.microchart
sap.viz
sap.ui.unified
etc..
__________________________________________________________

OData Services:
----------------------

OData Services mainly contains "Database functionalities"


( SELECT, INSERT , DELETE , UPDATE )

___________________________________________________________

SAP Fiori Elements:


____________________
1 . SAP Fiori List Report Element ( Reporting )
2. SAP Fiori OverView Page Element( Reporting + Charts )

_______________________________________________________________

Different Types of Templates in SAP Fiori Development:


--------------------------------------------

1. SAP Fiori Worklist template / SAP Fiori FullScreen Template


2.SAP Fiori Master-Details / SAP Fiori Split App Template
_____________________________________________________________

Official SAP Help Documentation:


_____________________________

https://sapui5.hana.ondemand.com
___________________________________

How to Identify Library / Class / Properties / Methods / Events ?


-----------------------------------------------------------------------------------
---

https://sapui5.hana.ondemand.com

select "Samples Section"

Left Side you Will find List of Screen Elements

Select one Screen Element ( For ex : Responsive Table )

Select API Refernce of that Screen Element ( For ex : sap.m.Table )

THen you will find Library / Class / Properties / Methods / Events etc....
___________________________________________________________

How to Identify The Sample Source Code of Various Screen Elements :


-----------------------------------------------------------------------------------
-----------------------

https://sapui5.hana.ondemand.com

Select "samples Section"

Select Screen Element ( For Ex : List )

Select "Samples" Tab

Select one of the option/sample

Select "Show Source Code for this Sample" icon

Then you will find Source code of That Screen Element


______________________________________________________________

How to identify Standard Icons provided by SAP For SAP Ui5/FIORI development ?
-----------------------------------------------------------------------------------
-----------------------------------------

https://sapui5.hana.ondemand.com/

Select Tools Section

Select "Icon Explorer" option

Select "SAP Icons"

Select one of the icon

Then you will find the name of The icon ( Right Side Section )
_____________________________________________________________________

Different Types of Templates in SAP Fiori Development:


--------------------------------------------

1. SAP Fiori Worklist template / SAP Fiori FullScreen Template


2.SAP Fiori Master-Details / SAP Fiori Split App Template
_____________________________________________________________

1. SAP Fiori Worklist template / SAP Fiori FullScreen Template


_____________________________________________________

If we create SAP Fiori Like app using SAP Fiori WorkList Template
Then automatically below files are autogenerated

worklist.view.xml
object.view.xml

worklist.controller.js
object.controller.js

component.js file
formatter.js file
style.css
manifest.json file
i18n.properties
metadata.xml file

______________________________________________________________

2.SAP Fiori Master-Details / SAP Fiori Split App Template


__________________________________________________________

If we create SAP Fiori Like app using SAP Master-Details Template


Then automatically below files are autogenerated

master.view.xml file
details.view.xml file

master.controller.js file
details.Controller.js file
component.js file
formatter.js file
style.css
manifest.json file
i18n.properties
metadata.xml file
__________________________________________________________________

Note : in SAP Ui5/FIORI :

View = Screen = Web Page

Note : in SAP Ui5/FIORI :

Each View is associated with Controller

NOte : "View" is for Screen Developement with Screen Elements


"Controller" is for EventHandlers with functionalities
"Model" is OData Service with Database operation

Note : All SAP Ui5/FIORI apps , Follows "MVC architecture"

___________________________________________________________________

You might also like