SAP Fiori Elements and Floorplans

By

This blog covers detailed information about Fiori Elements, Floorplans, layout, and annotations that are available in SAP Fiori.

SAP Fiori Elements:

SAP Fiori Elements is a library of several floor plans you can use to create enterprise apps easily. Predefined floor plans will connect to the backend using OData services. All you need to do is expose the required data source and add your metadata.

SAPUI5 runtime interprets metadata and annotations of the underlying OData service and uses the corresponding predefined templates. 

  1. No JavaScript UI Coding.
  2. Metadata-driven approach of Fiori development.
  3. Centrally Provided Templates covering Reporting, Analytic, Transaction Scenarios.

Annotations of OData service: 

Annotations are descriptive information for OData and enable the Metadata-driven UIs. It enables or modifies certain default features, adds semantics and structure to the data provided by the user.

Emotions can be created in the following 2 ways.

  1. ABAP CDS Annotations
  2. XML/Local Annotations

ABAP CDS Annotations uses the metadata extension file to enrich CDS objects

XML/Local Annotations uses the local annotation file in SAP UI5 project and maintains it locally SAP Fiori elements will consume these annotations to develop SAP Fiori applications.

Layouts and Floorplans:  

Layouts and floorplans can either be created using SAP Fiori elements or be built from scratch using basic building blocks as in the case of freestyle apps.

Floorplan is an umbrella term for the overall SAP Fiori UX concept. A floorplan is a UI pattern that provides consistent UX. It covers the different layout types, the structure of the controls used, and how to handle different use cases. Floorplans can be built with SAP FIORI elements formerly called SMART Templates or built from scratch.

Note: Analytical List Page, List Report/Worklist, Objects Page, and Overview Page floorplans are implemented as SAP Fiori Elements to speed up the development.

List Report
List Report Allows users to work with large list items and take appropriate action on them. It combines powerful filtering capabilities for huge data with varied ways of displaying the result set.



Object Page:
Object Page users to view, create or edit an object and is recommended floorplan for both simple and complex objects in SAP Fiori. It has a flexible header with anchors and tabs and has a responsive layout. It can be implemented using SAP Fiori elements (previously called ‘Smart Templates’) and OData annotations for speedy development. Alternatively, SAPUI5 controls can be used to implement it.




Analytical List Page
Analytical List Page Offers visualization for dynamic data and business intelligence capabilities that enable users to analyze data from various angles. The combination of transactional and analytical data using chart and table visualization lets you quickly view the data you need and perform Root Cause Analysis
.



Worklist
Worklist Displays a list of actionable activities assigned to the user to act based on roles. This mostly involves reviewing details of items and processing them. Users might have options to complete the task or delegate it.
 



Overview Page
Overview Page An Overview page is a data-driven app that provides a quick overview of user important data at one screen and displays the data in the form of Cards. A card is a smart uses component that uses UI annotation and a single business entity to display data. Information can be visualized on cards in different ways such as texts, charts, lists, tables, etc. Following are the supported card types 
  • Analytical Card
  • List Card
  • Bar Chart List Card
  • Link List Card
  • Table Card 
  • Stack Card | Quick View
  • Custom Card





Wizard 
It allows users to complete an unacquainted long process by dividing it into multi-step tasks and guiding throughout with appropriate instructions. 




Initial Page 
It allows the user to enter a single object using assisted input and then view or edit its details. This is required when the user is only expected to work on one object at a time. 




Ready to take the next step? Learn even more about SAP Fiori elements at https://sapui5.netweaver.ondemand.com. Choose the Developing Apps with SAP Fiori Elements option.



Comments

Post a Comment

Popular posts from this blog

Preparing the ABAP developement environment for SAP BTP

By
Image
Setup SAP BTP ABAP environment Login to the SAP BTP account with your registered email id Click on Trial Home Click on Go To Your Trail Account to navigate to trail intance BTP cockpit   Create service instance: you can do this by simply going to the booster tab Click start, it will create your instance on the cloud. Once the setup is done download the Service key. You can view the created service under instance tab How to Create ABAP Cloud project: Note: You must already have an SAP BTP account with an ABAP service and service key. Also install Eclipse and the SAP ABAP Development Tools. Open ABAP Perspective -> Choose File -> New -> ABAP Cloud Project Use a Service key option will be selected as default. Choose Next Import the file or paste the service key into the editor. Choose Next Select Open Logon Page in Browser for validatng the account. Use your BTP login credentials to validated the account and you will see success message  Once verified the account successfully sys
Read more

Introducing RESTful Application Programming

By
Image
RAP is just one code line for all different deployment options, SAP S4HANA or the cloud scenarios. the core of the RAP is based on CDS and supports all the draft functionality, the extensibility, and out-of-the-box implementation to take all the technical implementation tasks. With 7.5, it was the first time SAP introduced an end-to-end programming model. From CDS via BOPF up to the gateway level, we were able to create applications. RAP is the successor of the ABAP Programming Model for SAP Fiori. SAP extended the core data services by the so-called behaviour definition. The extension of the CDS language, and also the extension of the ABAP language itself, are used in order to have the native concept of built-in business objects.   Define a Database Table To implement the data model we would need at least one table. In this case, there is one single database table that contains flight connections. Here are the common steps that involve in the creation of a table. Create a Table Defini
Read more