Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
cancel
Showing results for 
Search instead for 
Did you mean: 
former_member323513
Participant
Do you have Fiori Elements applications you use but you really wish you could extend in some way?  For instance, perhaps you have an application that uses the List Report Fiori Element and you’d like to add a couple of filters to the Smart Filter bar?  As of Web IDE version 1809, you can do that!

In Web IDE, you can create a new Adaptation Project, indicate what application you’d like to base it upon, and then easily create a new variant, using the new SAPUI5 Visual Editor.

When you create an Adaptation Project, you are creating a new variant of an existing application. The app variant refers to the original application but contains separate set of changes created in the adaptation project. Also, an application ID is defined for the variant and needs separate registration in Fiori Launchpad.

In our aforementioned use case of adding some filters to the Smart Filter of a Fiori Elements List, you would do the following steps:

  1. Create a new adaptation project

  2. Name the new project’s name and choose the application upon which you want to base the variant. A new project is created and listed in your Web IDE workspace.

  3. Right click on the project and select, SAPUI5 Visual Editor to make changes to the project.

  4. This brings up your project in the SAPUI5 Visual Editor. This editor was formerly known as the UI Adaptation Editor, but the name has changed as its abilities have grown.  In the past, you could preview the application, make changes to the properties of controls in a Fiori Elements application, see an outline view of the controls and see a list of changes that had been made.  That functionality still exists, but now you can also add code fragments and extend with a controller. 




 

Again, changes made via the SAPUI5 Visual Editor are saved to a Changes folder and saved in the layered repository to be applied when the application is run.



From the editor you can preview your changes and ensure everything works. Once you’re satisfied with your changes, you can easily deploy your application and, because it has a different Application ID than the original application, both the original application and the new variant’s tiles will be available.

Technical notes for this initial release:

  • Source applications must be located on an ABAP repository.

  • You can create variants of Fiori Elements based applications. In a future release we will add support of SAPUI5, “freestyle,” applications as well.


Helpful links:

SAPUI5 Visual Editor 

Adaptation Projects for Fiori Elements Applications
75 Comments