Extending a Fiori App – Simple Use case – Part 3
In the previous two articles, I wrote about extending OData/SAPUI5 application. In this article I will cover the new Launchpad. All Fiori applications are generally displayed in the Launchpad as tiles. To be able to display the new enhanced application to the users, it has to appear as another tile on the Launchpad. I will create a new catalog and demonstrate how to add the new SAPUI5 project to it.
Begin with creating a new Launchpad via LPD_CUST.
Add a new application with the below values. Ensure that sapui5.component refers to the name of the new component which was declared in the component.js file. In our case, sapui5.component=cus.crm.mycalendar.CUST_CRM_MYCAL_EXT.
Next, open the Launchpad designer to create a new catalog using the URL http://<host:port>/sap/bc/ui5_ui5/sap/arsrvc_upb_admn/main.html?
You would see the standard catalogs listed on the left hand side. Click on the create icon.
Provide a name for the new catalog
Click on the + icon which appears on the detail area
This will display a screen with four tile templates. The Dynmaic App launcher can be used in scenarios where you need to show a count on the tile (number of tasks to approve). I will use a Static App launcher for now and keep it simple. We will need a Target Mapping to be associated for each of the application too.
Add both a Target Mapping and App Launcher – Static from the below screen.
The screen would look like below
Before we proceed, we would need to maintain sematic objects for Intent based navigation. In SPRO, navigate to “SAP NetWeaver User Interface Services” to add sematic objects.
Create a record with the object name. This will show up in the URL when the user navigates to the App.
Go back to the Launchpad designer and open the target mapping to maintain the below values. Select the Semantic object created above and provide a meaningful value for action.
Provide the below values for the Static App Launcher
Now the catalog is ready for consumption.
In PFCG, we have to create a role which refers to this new Catalog. After creating a role, from the transaction drop menu, select the catalog.
Assign the new catalog as shown below
Assign the role to the users. The role should look finally as below
Navigate to the Launchpad – http://<host:port>/sap/bc/ui5_ui5/ui2/ushell/shells/abap/FioriLaunchpad.html?
To add “My Catalog” to the left hand side, click on “Open Catalog”
From the Catalog drop down, select “My Catalog”. This will list the single tile which is assigned to it. Clicking on the grey + icon below it will add it to the “My Home”.
Now we should be able to see the new catalog in the Launchpad under “My Home”
I am using a chrome browser – developer tool (F12) to trace the calls being made. This way it is easy to verify if the new enhanced App is talking to my custom OData service.
Notice that the after launching the app, the URL will show http://<host:port/sap/bc/ui5_ui5/ui2/ushell/shells/abap/FioriLaunchpad.html?#MyCalender-view (referring to the Intent Navigation) we defined earlier.
To see the changes, navigate to the detail screen and look for additional fields in the bottom of the screen
I hope the series of articles have given you a good insight on the tasks required to extend Fiori apps.
Update: Below are some useful documents on Launchpad and the concept around it.