What’s new in Mobile development kit client 4.3

[Jitendra_Kansal]

I am happy to announce that a new release of the Mobile Development Kit is available for all Mobile Services customers and can be downloaded on the SAP Software Center (and also available on community Download page).

This release adds incremental functionality over the previous MDK Client 4.2 release.

SAP Mobile Services Client 4.3 is also available in Apple AppStore and Google Play Store.

SAP Mobile development kit (MDK) extends SAP Cloud Platform Mobile Services and Editor (SAP Web IDE/Business Application Studio/Visual Studio Code extension) to provide you with a complete set of mobile application development and management tools, on-boarding, offline support, and central lifecycle management. It offers a metadata-driven approach to create native supported applications so no experience of creating iOS or Android apps is required.

The main focus of this release are:

• 
  
  
  
  • 
    
    
    
    • New UI control: Signature Capture
    
    
    • Form Cell Section
    
    
    • Support App Switch with InApp QR Scanner
    
    
    • Horizontal Bar Chart
    
    
    • Charts & KPIs support in Object Header
    
    
    • HTTPS URL support in OpenDocument Action
    
    
    • MinNumberOfLines Property for Note Form Cell
    
    
    • Simplified Binding Syntax
    
    
    • Override Action Properties
    
    
    • Support Edm.Binary Type
    
    
    • Support Custom Headers for Service
    
    
    • Setting Search Field in Rule
    
    
    • Clickable Key Value
    
    
    • Support SAP Icons
    
    
    • ObjectCollection Extension
    
    
    • EULA
    
    
    • Branded Settings
    
    
    
    
  
  
  
  

New UI control: Signature Capture

You can now use Signature Capture control (Form Cell) to capture the user signature, this signature is saved as an image (.png) which can then further be uploaded to back-end system. Additionally, you can add timestamp & watermark label to the image.

 

Check the documentation for more details.

Form Cell Section

You can now add a Form Cell section in Section table page and put Form Cell controls into it.

E.g., you can now display results for a given input field being in the same page or you can toggle a switch to make data visible/invisible.

Check the documentation for more details.

Support App Switch with InApp QR Scanner

In the previous release, we introduced InApp QR scanner for on-boarding however user had to use third party QR code scanner to switch between apps. Now in new release, we have added App Switch capability inbuilt in the client where the user is prompted to either continue using the same app or switch to any other app of their choice. For more information refer the details for respective platforms iOS and Android.

Support Edm.Binary Type

All OData actions now support properties of type Edm.Binary.

<EntityType Name="Products">

  <Key>

     <PropertyRef Name="ProductID" />

   </Key>

 <Property Name=" ProductID " Type="Edm.Int64" Nullable="false" />

 <Property Name="Description" Type="Edm.String" Nullable="false" MaxLength="50" />

 <Property Name="BinaryData" Type="Edm.Binary" Nullable="false" />

</EntityType>

Support Custom Headers for Service

You can now defined custom headers (key/value pairs) in “Headers” property of .service file, the defined headers will be added automatically to all of the OData actions.

For example:

"Headers": {

    "Accept-Language" : "en-GB"

  }

Check the documentation for more details.

Simplified Binding Syntax

We have enhanced binding syntax to make it unified and simplified to use single curly braces.

Example 1:

Create entity failure - {{#ActionResults:create/#Property:error}}

Can be rewritten as:

Create entity failure - {#ActionResults:create/error}

Example 2.

Reason for Transfer: {{#Property:ReasonName}}

can we rewritten as:

Reason for Transfer: {ReasonName}

Note: You can still continue working with old binding syntax in your project, we provide backward compatibility. In case, you want to use new simplified binding syntax, make sure that you have  public store client updated to latest version or build a custom client using MDK SDK 4.3

Check the documentation for more details.

Horizontal Bar Chart

In MDK 4.2, we introduced new chart control (type: Line & Column), we are now adding new type Horizontal Bar in this release.

This is supported for AnalyticCardCollection, ChartContent and AnalyticView in ObjectHeader.

Charts & KPIs support in Object Header

You can now add either a chart or a KPI in the Object Header control.

Check the documentation for more details.

HTTPS URL support in OpenDocument Action

We now extend the support for rendering the resources via https URL in OpenDocument action.

To open any of the various document types on Android we use the default app for a file type and on iOS we use the QLPreviewController. This means on iOS you may not need a specific app however on Android one shall be required.

{

    "ActionResult": {

        "_Name": "OpenDocument"

    },

    "Path": "https://www.gstatic.com/webp/gallery/4.jpg",

    "_Type": "Action.Type.OpenDocument"

}

Check the documentation for more details.

MinNumberOfLines Property for Note Form Cell

Apps can now set minimum lines for Note Form Cell to allow better distinguish when you input multiple lines with texts.

For example, in below metadata, MinNumberOfLines are set to 2 and MaxNumberOfLines are set to 6, so when page is opened, Note Form Cell displays 2 lines by default and cell height grows to maximum 6 lines while entering inputs. At any point of time, it will display only 6 lines however there is no limit to have number of lines.

{

"_Type": "Control.Type.FormCell.Note",

"_Name": "Description1",

"MaxNumberOfLines": 6,

"MinNumberOfLines": 2,

"PlaceHolder": "MaxNoOfLines 6 & MinNoOfLines 2"

},

Check the documentation for more details.

Setting Search Field in Rule

You can now programmatically set/change the search string in the search field. This feature is useful when automatically entering search (without user input) via 3rd party barcode scanner or any other tools.

export default function SetSearchString(context) {

    let sectionTableProxy = context.getControl('SectionedTable');

    sectionTableProxy.searchString = "Rome";

}

 

Check the documentation for more details.

Clickable Key Value

Key Value items are now support an on-click action. You can now indicate if Key value item is clickable, so that user can take appropriate actions such as navigating to another page, or a pop-up menu to take actions.

{

    "KeyName": "PhoneNumber",

     "Value": "{PhoneNumber}",

     "OnPress": "/MDK43/Rules/Popover.action",

     "LinkColor": "#008000"

},

Please note, you need to further write a logic in order to trigger required actions.

E.g., on tapping PhoneNumber, you may want to either open a Messaging app or Phone app OR on tapping EmailAddress, you may want to open an Email app. For either case, you need to write a logic.

Check the documentation for more details.

Override Action Properties

You can now override the properties of an action that you want to execute.

Possible scenarios are:

• You create an action once and re-use it for different purposes.


• You want to execute an action in a loop each time overriding different properties

Override an action is possible in both Metadata definitions and also in JavaScript Rule.

E.g., you have a SimpleMessage.action that shows "This is a simple message" and closes when user pressed the OK button:

// /MyApp/Actions/SimpleMessage.action

{

  "_Type": "Action.Type.Message",

  "Message": "This is a simple message",

  "OKCaption": "OK"

}

You can assign the action to an OnPress event and override its properties:

//Excerpt of a page

{

  "ObjectCell": {

    "Title":"Press to show a message",

    "OnPress": {

      "Name": "/MyApp/Actions/SimpleMessage.action",

      "Properties":{

        "Message": "This is an overridden message",

        "OnSuccess": "/MyApp/Actions/NavigateToAnotherPage.action"

      }

    }

  }

}

When the Object Cell is pressed, it will show a message dialog with the text: "This is an overridden message" and will navigate to another page when user pressed the OK button.

Check the documentation for more details.

Support SAP Icons

UI controls that support image can now use SAP icons using sap-icon://<name> syntax

You can use it for all the controls with property type: image.

In below metadata example, icon property of Action bar item is set to Document font icon.

"ActionBar": {

 "Items": [{

     "OnPress": "/MDK43/Actions/MessageMe.action",

     "Position": "right",

     "Icon": "sap-icon://document"

        }]

},

The list of the supported SAP icons can be found here.

ObjectCollection Extension

• Horizontal Scroll Layout: App developers using custom extension for ObjectCollection now have support for Layout which support horizontal scroll for custom Object Cells. Refer to LayoutType for more information.


• Height Property: Apps can now set the Height property for the Object Cell Extension, this will allow better control of the size of each cells.

EULA

• Showing EULA on Launch: To allow users to accept End User License Agreement (EULA) and/or privacy statement before entering any personal information, we have moved the EULA screen to the very first screen when the app is launched if user has not previously on-boarded.


• Support EULA in HTML Format for iOS: Apps can now provide HTML version of the EULAText file.


• Support Localization of EULA: Apps can now provide localized version of the EULAText.html.

 

 

Check the documentation for more details.

Branded Settings

• Support specifying allow domains in QR on-boarding: Client allows the logon connection settings from a scanned or side-loaded QR image. The connection settings contain several server URLs for logon to Mobile Services, without validating these server URLs, users can be tricked to input their SAP Cloud Platform logon credentials.  App developers can now specify the whitelisted URLs in BrandedSettings.json to control the allowed domain, subdomain as part of the server URLs.

The .hana.ondemand.com domain is allowed by default and always. For connection settings using other custom domain, URLWhitelist can be specified as below:

    {

    "ConnectionSettings": {

      "SapCloudPlatformEndpoint": "https://someservice.abc.com/...",

      "AuthorizationEndpointUrl": "https://someservice.xyz.com/...",

      ...

    },

    "URLWhitelist": [

      ".abc.com",

      ".xyz.com"

    ],

  }

• Cache configuration for Images and Documents: HTTP images and documents downloaded in the app are cached for better performance. CacheSettings property provide app developers control on the allowed disk cache for images and documents.

  "CacheSettings": {

    "ImageCacheSizeMB": 512,

    "DocumentCacheSizeMB": 256

  },

 

New to MDK development?

Follow these tutorials to learn more about Mobile development kit

• Create your Mobile Development Kit (MDK) app in SAP Business Application Studio


• Migrating Your Mobile Development Kit (MDK) Apps from SAP Web IDE to SAP Business Application Studio


• MDK documentation:
  
  
  
  • Guides
  
  
  • API references
  
  
  
  

Regards,

Jitendra Kansal

Product Management, SAP Cloud Platform Mobile Services
SAP SE