IPhone Andorid App using Xamarin(C#) to Save Signature in SAP

[vodela]

Last year I had written a few blogs on Cross Platform Development using Xamarin

C# Cross Platform Mobile Application using Xamarin Forms

Using this approach I could develop SAP Purchasing App and order SAP Order to cash applications

Order to Cash Mobile Application using Xamarin Forms & C#

The basic idea in these applications was that I took SAP Transactions write C# code using Xamarin and develop native code generated apps for mobile phones. Using this approach we can develop mobile apps for most of SAP Business Processes.

I wanted to extend the functionality of my mobile apps by providing additional features which will improve the security and audit of documents by asking

the user put in their signature with each document they modify.  This will be very helpful in many situations and required in certain situations.

Luckily with Xamarin  there is Component called Signature Pad which provided the required functions from the device side.  A lot of documentation is provided by Xamarin at their web site and there are excellent sample projects on github that you can look at it to implement in your xamarin apps. I have developed a cross platform mobile application using Xamarin forms which will allow you to store signature with document number on SAP and this runs on IPhone and Andorid.

In my earlier blogs I have covered aspects of cross platform projects using Xamarin forms - you can also visit Xamarin web site or github for samples or youtube for Xamarin Videos.  Once you create a project you have include Signature Pad component for IOS and Android Project.  In this app I give the user the ability to

store signature for Notification (PM Tcode IW52) and Service Order (IW32).  The REST Calls are made to SAP and the process is the same as described in my earlier blogs.  Once the app is developed I have the following Screen on my mobile device

Once you click the appropriate button a record is created in SAP with info.  From Xamarin Side we invoke a REST Service with the the data.  The Signature Pad component requires a string with X,Y coordinates of each point - This can obtained using the method of signaturepad provided by Xamarin Components.

So we need to pass this huge array along with document number and comments to SAP. Due the limitations of SAP Field Size on Strings we have to design the tables so that we can store large number of co ordinate information.  To achieve this I designed the tables  so that Coordinate information is stores in one table and the other Text is stored in a different table

So for each Document we can store any number of Coordinate information as required.

When a click Button is invoked a REST Called is invoked passing the data  The following is C# Code that invokes SAP

                   ZPS_SIGNATURE inrec = new ZPS_SIGNATURE();

                    inrec.AEDAT = System.DateTime.Now.ToString("yyyyMMdd");

                    inrec.AUFNR = NotificationNumber;

                    inrec.OBJECT = "NOTI";

                    inrec.NOTES = NotiText;

                    inrec.SIGDATA = JsonConvert.DeserializeObject<List<ZPS_SIGNATUREDATA>>(SigArray);

                  string instring = Newtonsoft.Json.JsonConvert.SerializeObject(inrec);

                    List<ZTRETRUN> ret = await dataManager.updatesignature(instring);

                    ReturnMessage = new ObservableCollection<ZTRETRUN>(ret);

                    OnPropertyChanged("ReturnMessage");

on The SAP side the structure the structure ZPS_SIGNATURE is as follows

The Rest call will convert JSON to this format and the SAP call will populate the table so that signature is stores in SAP.

When we want to retrieve the signature the signature the user enters document number on the device at which time the REST Service will fetch all records for the document ( there could be mutiple records on different dates with different comments) - We get the header information without the signature data to minimize the data - when the user clicks on the list - then we go make a REST call get the signature information .

On Header list page the following code in C# will fetch the header record list

public async void OnHistoryClicked(object sender, EventArgs e)

       {

           if (string.IsNullOrEmpty(viewModelHistory.DocumentNo))

               return;

           await viewModelHistory.ExecutesetHistoryHeaderCommand();

       }

When the user click on a record to see the signature - the following code will make REST call to SAP to get signature Data.

public async void OnItemSelected(object sender, ItemTappedEventArgs e)

       {

           if (e.Item == null)

               return;

           ZPS_SIGNATURE L = e.Item as ZPS_SIGNATURE;

           viewModelHistory.DocumentNo = L.AUFNR;

           viewModelHistory.DocumentDate = L.AEDAT;

           await viewModelHistory.ExecutesetHistoryDetailCommand();

           L = viewModelHistory.HistoryDataList.FirstOrDefault<ZPS_SIGNATURE>();

           await Navigation.PushAsync(new DocumentHistoryDetailPage(L));

       }

The following are the device screens for the same

I have tested on Android and Iphone 6 Plus should also work on Windows Phone due to simplicity for development using Xamarin Forms and free Signature Components provided  by Xamarin.