9. Adding UI Annotations in Fiori Elements Apps-Part 2
In this video, we continue our SAP Fiori Elements UI Annotations series using ABAP on SAP BTP (Cloud Environment).
You’ll learn how to add color coding to a Fiori Elements app by using UI annotations and CDS views.
🔹 What you’ll learn in this video:
1️⃣ How to keep the Status column visible even when the app is zoomed out using `importance: #HIGH`
2️⃣ How to implement color coding for status values (Green, Yellow, Red)
Creating a Criticality field in the Root CDS View using CASE logic
3️⃣ Exposing the Criticality field in the Projection CDS View
4️⃣Binding the Criticality field to the UI using @UI.LineItem criticality annotation
5️⃣ Previewing the Fiori Elements app using OData Service Binding
🔹 Status Color Mapping Used:
🟢 Green – Accepted
🟡 Yellow – Open
🔴 Red – Rejected
🔹 Key Technologies Covered:
▶︎ SAP Fiori Elements
▶︎ ABAP CDS (Root & Projection Views)
▶︎ UI Annotations (LineItem, SelectionField, Criticality)
▶︎ SAP BTP ABAP Environment
▶︎ OData Service Binding & App Preview
This video is ideal for SAP ABAP developers, Fiori consultants, and anyone working with Fiori Elements List Reports who wants to enhance UI usability with visual indicators.
👍 If you found this video helpful, don’t forget to like, share, and subscribe for more SAP Fiori & ABAP Cloud tutorials.
📌 Stay tuned for the next part in this series!
#SAPFiori #FioriElements #ABAPonCloud #CDSViews #UIAnnotations #SAPBTP #SAPABAP #saphana