Skip to Content
Author's profile photo Jens Limbach

SAP Cloud Development: How to create a complete Thing-Based UI?

In this Blog I will introduce the creation of thing based UI’s. I will use a simple Business Object called Bonus Plan. I assume that you already know the basics regarding the SAP Cloud Applications Studio. If not, also no Problem, just watch my first series of videos and get some hands-on experience on how to start the development for SAP’s Cloud Solutions: YouTube: Getting started with SAP Cloud development!

Getting started with Thing-Based UI’s:

Thing-Based UI’s were introduced with Cloud for Customer and are very much different to the Object-Based UI’s. Watch this Video to see how to create your first Thing-Based UI scenario with SAP Applications Studio and the UI Designer:

Update 29.12.2013: Part 4 and 5 are released

Posted a new basic video tutorial on how to modify the generated Quick Create UI (QC):

Video How-To: Fine tune the QC UI (Quick Create)

And another one how to do basic modificaitons to the generate Thing Inspector UI (TI):

Video How-To: Fine tune the TI UI (Thing Inspector)

PS: Make sure you select HD quality 720p.

Part 1: Explaining the use case and the basic steps for a thing based UI.

Part 2: Explaining how to add a refresh to the OWL (ObjectWorkList) after you updated your BO via the QC (QuickCreate) or TI (Thing Inspector).

Part 3: Explaining how to add a remove icon and action to the OWL (ObjectWorkList)

If you want to read more about creating thing-based UI’s I can highly recommend the blog entry of Thomas Schneider: Thing-Based UIs and Custom Solutions in Sales OnDemand

Assigned Tags

      23 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Thomas Schneider
      Thomas Schneider

      Hi Jens,

      great blog, thanks a lot for the ouutanding video.

      All the best,

      Thomas

      .

      Author's profile photo Former Member
      Former Member

      Fantastic video Jens!

      Author's profile photo Ralf Baumann
      Ralf Baumann

      Great log. Nice to see video tutorials here.

      Author's profile photo Jens Limbach
      Jens Limbach
      Blog Post Author

      Posted a new basic video tutorial on how to modify the generated Quick Create UI (QC):

      Video How-To: Fine tune the QC UI (Quick Create)

      And another one how to do basic modificaitons to the generate Thing Inspector UI (TI):

      Video How-To: Fine tune the TI UI (Thing Inspector)

      Author's profile photo Former Member
      Former Member

      Hi, thanks for your sharing. I'm learning the ABAP and UI Designer. Could you introduce me some free documents about that, especially UI Designer? I found little materials about it. Only found the “SAP Business ByDesign Studio -Application Development”, but it's too expensive. Thanks a lot.

      Author's profile photo Former Member
      Former Member

      Hi Jens, thank you for sharing the video. This is my first attempt on cloud development.

      I have a question, in the first video for Thing-Based UI, there's a step where you set "Outport to Quick Create" manually. I followed the exact step but when I hit save, the value "QuickCreate" is not saved.

      Could you please advise?

      I've also tried the alternative to create the outport manually in the UI, however, this requires PortTypePackage and PortTypeReference. Could you please explain what does this do?

      Your reply is much appreciated.

      Author's profile photo Jens Limbach
      Jens Limbach
      Blog Post Author

      Hi Hazel,

      good point. The typing of the "QuickCreate" is actually not required. In any case it should still work. Maybe you missed another step... I don't have time to check today. But I will try to get back to you...

      Cheers,
      Jens

      Author's profile photo Former Member
      Former Member

      Hi Jens,

      Followed the exact procedures, but still Custom button not getting visible on the screen any reason for this ?

      Author's profile photo Tom Lennart Krupp
      Tom Lennart Krupp

      Hi Papps,

      I know that there were recently troubles with this functionality. Try to download the most up-to-date studio, install it and build your screens again. If this is not helping, kindly report an incident.

      Best regards

      Tom

      Author's profile photo Former Member
      Former Member

      Hi Tom,

      I have 1505 CAS  Version with me.

      I tired to delete and create again still the same. If am exactly following the procedure shown in the video the button is not appearing .

      I tried to have another button with custom action that button is appearing.

      Does this still mean  I should go ahead and create one incident ?

      Author's profile photo Tom Lennart Krupp
      Tom Lennart Krupp

      Hi Papps,

      yes, I would open an incident.

      Best regards

      Tom

      Author's profile photo Former Member
      Former Member

      Hi Jens,

      Very nice videos !  My question is about using SAP Cloud Applications Studio to modify SAP Cloud for Customer.  Is this possible?  And if you add your own "Thing Based Scenario" to SAP Cloud for Customer, will it automatically work in the Mobile iPad Application too?

      This is the Mobile App I am referring to: SAP Cloud for Customer for iPad on the App Store on iTunes

      Thanks,

      Steve

      Author's profile photo Jens Limbach
      Jens Limbach
      Blog Post Author

      Hi Steven,

      yes, this works for SAP Business ByDesign as well as for SAP Cloud for Customer. The thing based scenario should automatically work on iPad (maybe a bit of fine tuning of the UI will be necessary).

      Cheers,
      Jens

      Author's profile photo Former Member
      Former Member

      Hi Jens,

      Will the changes also reflect on Android tablets?

      We are observing a lot of differences between the iPAD app and the Android App.

      The changes we are making via SDK are available on the iPad App, but inspite of tagging for all (mobile, tablet etc), the same changes are not reflected on the Android App. For Example when we add a new facet either via SDK or via UI, it only shows up in the iPad app, not on the Android App.

      Is there a development guide for making App specific developments.

      Regards,

      Manasi

      Author's profile photo Tom Lennart Krupp
      Tom Lennart Krupp

      Hi Jens,

      is it possible to add an OVS to an existing QuickCreate View?

      Example: I would like to have an ID look up for an Custom BO on the standard Opportunity QuickCreate Screen.

      After Adding my extension field via the Extensibility Explorer I tried to switch the Display Type "Inputfield" to "Object Value Selector". I am prompted with an Error "Component which you a are trying to edit comes from a lower layer. Please use the Extensibility Explorer to edit." When I try to achieve this via the Ext. Explorer I cannot see an option to add an OVS to my extension field. Am I limited at this point?

      Thanks and best regards

      Tom

      Author's profile photo Jens Limbach
      Jens Limbach
      Blog Post Author

      Hi Tom,

      yes, this is possible! Your extension field must be of data type id and then you can click "Change ID list configuration" (something like that, I cannot look it up right now) and then you can select an OVS in the following dialog.

      You can either select a public OVS or your custom OVS.

      Cheers,

      Jens

      Author's profile photo Tom Lennart Krupp
      Tom Lennart Krupp

      Hi Jens,

      I already got it done via the Extension Explorer (the way you described it "Change ID list config.." etc.). With the searchfield-binding I had a little trouble, but now it is working fine. If someone is willing to do a custom OVS: Find here a short summary about how to do the binding with a custom OVS and it's search fields. http://scn.sap.com/thread/3592310.

      Thanks and best regards

      Tom

      Author's profile photo Srinivasan S
      Srinivasan S

      Hi Everyone,

                          I am trying to add a button using Thing Based UI following the first video of Jens. The button does not trigger any event nor any pop-up occurs even after following the exact procedure. Please provide a solution.

      Regards,

      Srinivasan.S

      Author's profile photo Benny Huang
      Benny Huang

      Hi Jens and experts,

      I am trying to follow the first video, the button of QC can not trigger.

      For example: the "Cancel" can not close the QC screen.

      The default is "Save", the "Save" is OK, it can add data to the owl.

      But I can not trigger the  "Save and Close", the "Save and New" and the "Save and Open".

      Please help me for the "Cancel" button, and three button about "Save", maybe I miss some step.

      Thanks a lot.

      Benny

      Author's profile photo Motaz Shrief
      Motaz Shrief

      Hi Experts,

      Could you please advice me way to Edit records on OWL, because my owl custom instances are automatically generated using standard BO.

      her i want to edit some elements, and let some elements read only on the owl.

       

      best Regards,

      Motaz Naguib

      Author's profile photo BalReddy Allam
      BalReddy Allam

      Hi Jens,

      Videos are very good. Anyhave i got doubt while creating Thing based UI,in your video you have  created Thing based and created  “NEW” button on the Application tool bar  .But i too have created the same  as you have created but i am unable to see the “NEW” button in 1711 .Without NEW button it is not possible to create a record .Can you help me out ?

      Can we use Both Thing based UI and Object navigation UI in One solution ?

       

      Author's profile photo Pratyush SINHA
      Pratyush SINHA

      Hello Jens Limbach :

      All your videos are now private. Can you please make them public for some time.? I was in process of learning.

      Thank you

      Regards

      Prat

      Author's profile photo Buddhika Krishantha
      Buddhika Krishantha

      DearJens Limbach.

      Could you please make these videos public?