// Explore More Tutorials
List Report Floorplan
2018-12-02
Intermediate
20 min.
Enhance your app with a Fiori List Report Floorplan
You will learn
In this tutorial, you will learn three things:
- Add a view to show related entities of an OData navigation link (i.e., an OData
$expand
) - Display this view according to the List Report Floorplan
- Add barcode scanner to the List Report’s search bar
In this example, you build upon the demo app created using the Sample OData service. If you examine the service’s metadata (URL: https://hcpms-YourIDtrial.hanatrial.ondemand.com/SampleServices/ESPM.svc/$metadata
) you see entity Supplier has a one-to-many relationship with Products:
<EntityType Name="Supplier">
<Key>
<PropertyRef Name="SupplierId"/>
</Key>
<Property MaxLength="40" Name="City" Nullable="true" Type="Edm.String"/>
<Property MaxLength="3" Name="Country" Nullable="true" Type="Edm.String"/>
<Property MaxLength="255" Name="EmailAddress" Nullable="true" Type="Edm.String"/>
<Property MaxLength="10" Name="HouseNumber" Nullable="true" Type="Edm.String"/>
<Property MaxLength="30" Name="PhoneNumber" Nullable="true" Type="Edm.String"/>
<Property MaxLength="10" Name="PostalCode" Nullable="true" Type="Edm.String"/>
<Property MaxLength="60" Name="Street" Nullable="true" Type="Edm.String"/>
<Property MaxLength="10" Name="SupplierId" Nullable="false" Type="Edm.String"/>
<Property MaxLength="80" Name="SupplierName" Nullable="true" Type="Edm.String"/>
<Property Name="UpdatedTimestamp" Type="Edm.DateTime"/>
<NavigationProperty FromRole="Supplier" Name="Products" Relationship="ESPM.Supplier_Product_One_Many0" ToRole="Product"/>
</EntityType>
In this tutorial, you will enhance the Suppliers entity detail view to show its related Products in a List Report Floorplan.
Step 1: Create a new Table View Controller
Step 2: Create new subclass of a UITableViewController class
Step 3: Add navigation Table View Cell to Detail Table View
Step 4: Implement Table View Cell for Suppliers
Step 5: Implement navigation logic
Step 6: Implement the SAP Fiori List Report Floorplan
Step 7: Add Search Bar, Toolbar and Navigation bar
Step 8: Add toolbar buttons
Step 9: Update info.plist file
Step 10: Enable Barcode Scanner in Search bar
Step 11: Using the Barcode Scanner
Prerequisites
- Development machine: Access to a Mac computer
- Tutorials: Using the SAP Fiori Mentor app
Navigate tutorial steps
-
Step 1: Create a new Table View Controller
-
Step 2: Create new subclass of a UITableViewController class
-
Step 3: Add navigation Table View Cell to Detail Table View
-
Step 4: Implement Table View Cell for Suppliers
-
Step 5: Implement navigation logic
-
Step 6: Implement the SAP Fiori List Report Floorplan
-
Step 7: Add Search Bar, Toolbar and Navigation bar
-
Step 8: Add toolbar buttons
-
Step 9: Update info.plist file
-
Step 10: Enable Barcode Scanner in Search bar
-
Step 11: Using the Barcode Scanner
- Back to Top