Skip to Content

Customize the Wizard Generated Application

Beginner
1 hr.
SAP BTP SDK for Android, Beginner, Tutorial, SAP Business Technology Platform, Android, Mobile
Customize a wizard-generated application and learn how to use Fiori object cells, search UI, and the collection view.
You will learn
  • How to customize the values displayed in an object cell
  • How to modify the navigation between screens
  • How to change menu options
  • How to enable filtering of object cells on a list screen
  • How to add a collection view showing the top products
flyingfish162Bruce MengMarch 31, 2025
Created by
sandeep-tds
January 9, 2023
Contributors
sandeep-tds
flyingfish162

Prerequisites

  • Step 1

    1. Run the previously created project.

    2. Select Products.

      Entities screen
      Original Products Screen

      The category name is displayed (rather than the product name) because the app was generated from the OData service’s metadata, which does not specify which of the many fields from the product entity to display. When creating the sample user interface, the SDK wizard uses the first property found as the value to display. To view the complete metadata document, open the res/raw/com_sap_edm_sampleservice_v4.xml file.

      XML
      Copy
      <EntityType Name="Product">
    <Key>
        <PropertyRef Name="ProductID"/>
    </Key>
    <Property Name="Category" Type="Edm.String" Nullable="true" MaxLength="40"/>
    ... ...
    <Property Name="Name" Type="Edm.String" Nullable="false" MaxLength="80"/>
    ... ...
</EntityType>

      Each product is displayed in an object cell, which is one of the Fiori UI controls for Android.

      object cell

      As seen above, an object cell is used to display information about an entity.

    What effect does the `masterPropertyName` have on the entity list screen?

  • Step 2

    In this section, you will configure the object cell to display a product’s name, category, description, and price.

    Which properties of the object cell were set in this section?

  • Step 3
  • Step 4

    In this section, you will modify the app to initially show the Product Categories screen when opened. Selecting a category will navigate to a Products screen for the selected category. The floating action button on the Categories screen will be removed.

  • Step 5

    In this section you will add a search field to Product Categories screen, allowing users to filter the results displayed on the screen.

    Further information on the Fiori search UI can be found at SAP Fiori for Android Design Guidelines and Fiori Search User Interface.

  • Step 6

    For more details, see Collection View in SAP Fiori for Android Design Guidelines and Collection View

    For more information on SAP Fiori for Android and the generated app, see Fiori UI Overview, SAP Fiori for Android Design Guidelines, Fiori UI Demo Application and the WizardAppReadme.md file located in the generated app.

    Congratulations! You have now made use of SAP Fiori for Android and have an understanding of some of the ways that the wizard-generated application can be customized to show different fields on the list screens, add or remove menu items, perform a search, and use a collection view.

Back to Top
Back to top