Recently I had been asked, if it is possible to capture user’s signature on mobile device and store it on the server. It is of course possible to do so using some open source tools such as “szimek/signature_pad · GitHub“. What would be interesting to know is how do we integrate it seamlessly with SAPUI5?

Here is a SAPUI5 custom control wrapper around the Signature Pad, which can make it easy for you to use this in your respective SAPUI5 / Fiori applications.

The demo can be seen here https://jsfiddle.net/rahulchoudhary/a3pz4go5/

Screen Shot 2016-01-05 at 10.12.33 AM.png

If you dont want to use open source tools, you can still create your very own implementation using SAPUI5 custom control by attaching mouse / touch listeners to the canvas elements.

This dirty demo was written in hurry to help a colleague, hence there are lack of code comments. Feedback is always welcome to improve the implementation.

To report this post you need to login first.

8 Comments

You must be Logged on to comment or reply to a post.

  1. SaiNithesh Gajula

    If it is view controller, it is working fine. But not working in the fragment.
    I want to use signature pad in the fragment. 
    I am facing rendering issue, as the controller is loaded first before the fragment is called.

    Please help me out on this issue.

    (0) 
    1. Daniel Nguyen

      This was posted quite a while ago but thought I might as well response anyways to it for future readers.

      Assuming you’re using custom control, be sure to declare a namespace for it it inside your fragment. Like so:

      <core:FragmentDefinition 
      	xmlns="sap.m" 
      	xmlns:core="sap.ui.core" 
      	xmlns:control="path.to.your.control">
      ...
      </core:FragmentDefinition>

      Then when the controller calls the fragment, the custom control will be loaded along with it.

      (0) 

Leave a Reply