CD165_exercise_solutions.pdf

8/11/2019 CD165_exercise_solutions.pdf

http://slidepdf.com/reader/full/cd165exercisesolutionspdf 1/28

BUILD A CLOUD APP FOR SAP BUSINESS

BYDESIGN AND OTHER CLOUD OBJECTSCD165Exercises / SolutionsWerner Wolf, Thomas Gross-Boelting / SAP AG

This document provides the exercise descriptions and a detailed step-by-step guide which you can follow toperform the exercises. At the end of the document you will also find the code snippets for the businessobject and the business logic implementation for your reference.



2

EXERCISE 1: DOWNLOAD SAP BUSINESS BYDESIGN PLAYER

Step 1: Install the Player App

Procedure

Go to the App Store App on your iPhone / iPad

Search for sap business bydesign and install the App

Step 2: Configure the settings for the player App

Procedure

Start the ByDesign app on your iPhone/iPad

Select Enter Configuration in the pop up if you use the app for the first time

Enter the URL (will be provided in the session) on the Settings screen and select Done

Enter the user and password (will be provided in the session) and press Log On

Check that you can connect to the system Close the App



3

EXERCISE 2: CREATE THE WEB SERVICES

Tasks:

Create 2 new REST Web Services:

ZIP2Point: Calculate latitude and longitude from a ZIP code Weather: Retrieve the weather data for the location

Save and activate your web services

Procedure

Close all browser windows

Open the SAP Business ByDesign System in the browser

Double Click on the “Student (Local)” folder icon (desktop), go to folder CD165, double click the link ‘SAP Business

ByDesign’

Logon with your user and password

Select Application and User Management (mouse over) -> Mashup Web Service (click)

Select New -> Rest Service



4

Define the first web service and run a simulation

Enter as Service Name ‘ZIP2Point’

Enter as URL the service URL for the web service.(See: Student (local) folder and there in CD165 / Code Snippets, file name: Point2ZIP_Service.txt )

Press the button ‘Extract Parameters’. The parameter will show up in the Input Parameters table.

Press Simulate in the OutputParameters section and check the result.

Press Save and Close. Confirm the Popup.

Repeat the same steps for the creation of the second web service:

Enter as service name ‘Weather’

Enter as URL the service URL of the web service(See: Student (local) folder and there in CD165 / Code Snippets), file name: Weather_Service.txt)

Press the button ‘Extract Parameters’. The parameter will show up in the Input Parameters table.

Press Simulate in the OutputParameters section and check the result.

Press Save and Close. Confirm the Popup.



5

EXERCISE 3: CREATE THE BUSINESS OBJECT AND THE BUSINESS LOGIC

IMPLEMENTATION

Step 1: Create a new business object called “Weather_xxx” (xxx = Group #)

Tasks:

The BO should contain the following elements: Customer: The customer for whom the weather data shall be displayed City: City of the customers address ZIP: Zip code of the city Street: Street of the customers address Country: Country of the customers address Temperature: Weather condition temperature Visibility: Weather condition visibility RelativeHumidity Weather condition relative humidity Description Description field

The BO should also contain: An association to the Customer. An action GetWeather to determine the Weather condition.

Save your business object.

Hints

Start the Studio from Start > All Programs > SAP > SAP Cloud Application Studio Logon and then double click on the solution on the left in My Solutions Code completion during business object definition can be explicitly triggered via <CTRL> + space. For the Business Object Customer you need an Import Statement to AP.FO.BusinessPartner.Global

Procedure

Start the Studio from Start > All Programs > SAP > SAP Cloud Application Studio

Logon and then double click on the solution on the left in My Solutions In the Solution Explorer, right click on your project and choose Add -> New Item.

Select Business Object in the pop-up and enter Weather_XXX.bo in the Name field.Replace XXX by the group number of your group.

Click Add .

On the Weather_XXX.bo tab, enter the business object definition.



6

Add the following elements:

Hint: The code snippet with the complete business object definition can be found at the the Student (local) folderand there in CD165 / Code Snippets.

ELEMENT NAME DATA TYPE

Customer PartyID

City LANGUAGEINDEPENDENT_LONG_Description

ZIP LANGUAGEINDEPENDENT_SHORT_Name

Street StreetName

Country CountryCode

Temperature LANGUAGEINDEPENDENT_LONG_Description

Visibility LANGUAGEINDEPENDENT_LONG_Description

RelativeHumidity LANGUAGEINDEPENDENT_LONG_Description

Description LANGUAGEINDEPENDENT_LONG_Description

Add the import statement:

import AP.FO.BusinessPartner.Global

Add the association:

ASSOCIATION TO

ToCustomer Customer

Add the action:

Action GetWeather

Click Save and Activate.



7

Step 2: Create the business logic implementation

Task Implement the business logic to set the association to the selected customer instance in the AfterModify Event and

implement the GetWeather action which retrieves the weather data for the selected customer via a REST service. Create a script for the AfterModify Event and the Action

Implement the coding

Hints Use right-click in the Solution Explorer on your business object, Create Script Files and select the corresponding

event.

Procedure

In the Solution Explorer, right click on Weather_XXX.bo and choose Create Script File.

In the popup, select the file ‘Event: After Modify’. The file ‘Action: GetWeater’ is automatically selected.

Press OK.

In the Solution Explorer, right-click on the file ‘Event- AfterModify.absl’ and choose Open.

Implement the business logic for the after modify event and save the file.

Hint: The code snippet with the implementation can be found at the Student (local) folder and there in CD165 /Code Snippets.

In the Solution Explorer, right-click on the file ‘Action-GetWeather.absl’ and choose Open.

Implement the business logic for the action.

Hint: The code snippet with the implementation can be found at the Student (local) folder and there in CD165 /Code Snippets.



8

Attention: Replace the service IDs used in the code snippet with the correct service IDs of the previouslycreated web services. The service IDs for the web services can be found in the Property view:

In the Solution Explorer, right-click on Weather_XXX.bo and choose Activate.



9

EXERCISE 4: CREATE AND ADAPT MOBILE FLOORPLANS

Step 1: Generate a complete floorplan scenario for your business object

Task Generate a complete mobile floorplan scenario with navigation for your business object

Hints The screen generation wizard can be reached in the Solution Explorer via right-click on the business object.

Procedure

In the Solution Explorer, right click on Weather_xxx.bo and choose Create Screens. Keep the default screen name.

Choose as supported device Mobile Only.

Select Screen Scenario with Navigation.

Enter 1 as Short ID.

Click OK .



10

Step 2: Assign the generated screen to your user

Task

The generated UIs need to be assigned to the user to be used on the mobile device

Procedure

Close all browser windows

Open the ByDesign System in the browser

Double Click on the “Session (local)” folder icon (desktop), go to folder CD165, double click the link SAP BusinessByDesign

Logon with your user and password

Select Application and User Management (mouse over) -> Business Users (click)

Enter your user in the find field and press Go

Select Edit –> Access Rights



11

On the Available work centers click on the find button, enter Weather_XXX to find your work center and press Locate.

Select the “Assigned to User” check box on the right of the list

Press Save and Close and confirm any warnings

Step 3: Test your Floorplans in the iPhone Player

Task Test generated UI in the player



12

Procedure

Start the ByD Player App on the iPhone/iPad.

Select the button Options to configure that the system remembers user and password the next times

Enter 60 Minutes at Remember Password and Select Done Logon using your user and password (will be prefilled the next time)

Enter a password to save your credentials to be reused after a timeout

Confirm your password

If everything worked fine you should see your new Work Center View Weather_XXX at the bottom of the list

Step 4: Adapt the generated floorplans (Object Work List OWL)

Task

The generated floorplans UI still need to be adapted so that they can be properly rendered by the player. Start byadapting the overview list.

The following parts will be adapted: The + button on the will be mapped to the New event Only a few fields will be displayed in the overview The overview table will react on a tap on the field No display of labels

Procedure

In the Solution Explorer view, double click on Weather_XXX_OWL.OWL.uicomponent to open it in the UI Designer

Select the Pencil icon to switch to change mode.

Delete all columns except City via right click on the column and select Delete -> Column.This will remove the columns from the overview screen. Answer the popup question “Do you want to delete the data field” with yes.



13

Add the column Customer to the tableo Go to the BO Browser tab on the right, select the field Customer and drag&drop it on the

column title City on the left.

Click on the Party ID column on the list and change the label in the Properties Tab to Customer .Click on the button on the right and switch in the pop-up the text pool to Overridden Text



14

In the same Properties Tab select the EditHandler for the OnClick Event

.

Select the outer frame of the table and on the properties tab select ShowHeaderRow = False

Right click on the Edit button and press delete. Same for the Export button.

Save and activate your floorplan



15

Step 5: Adapt the generated floorplans (Quick Activity QA)

Task The generated floorplans for saving/changing the data still need to be adapted so that it can be properly rendered

by the player.

The following parts will be adapted: Remove the View All button Change the action of the Save Button to “Save and Close” Link a Look-Up table (OVS) to select the customer and filter the OVS to Accounts only Change the floorplan title

Procedure

In the Solution Explorer view, double click on Weather_XXX_QA.QA.uicomponent to open it in the UI Designer


Right click on the View All button and press delete

Go via the Controller tab to the Event Handler SaveHandler and change the Window Action For the Save action toSaveAndClose



16

Back on the Designer tab, select the Customer field drag&drop it to be the first field and change the Display Type inthe Properties to ObjectValueSelector .

Assign the OVS component Party.OVS and filter the OVS to Accounts only:

Click on “…” of the OVSComponent in the Properties



17

Browse in the repository into SAP_BYD_APPLICATION_UI > publicovs > partyid and select Party

To filter the OVS select the field PartyTypeCode and move it with the button to the parameter section andenter the value 159, which is the code for accounts. (see Online Help: PartyTypeCode > BusinessObjectTypeCode)



18

Change the floorplan title in the properties to Weather Info

Save and Activate the QA floorplan

Step 6: Test your modified Floorplans in the iPhone Player

Task Test modified UI in the player. You should be able to verify the changes you made in the previous step.

Procedure


Enter your Application Password

Logon using your prefilled user and password

You should be able to save and modify newly created objects



19

EXERCISE 5 (OPTIONAL):

USING SAP BUSINESS OBJECT DATA AND ADD A LINK TO A MAP VIEW

Step 1: Adapt your QA to show the customer name

Task Add the data field BusinessPartnerFormattedName from the associated Customer object. Add the data binding for the customer text (BusinessPartnerFormattedName ) to the QA field Customer

Procedure

In the Solution Explorer view, double click on Weather_XXX_QA.QA.uicomponent to open it in the UI Designer


In the Data Model tab Drag&Drop the field BusinessPartnerFormattedName from the BO Model structureToCustomer > CurrentCommon to the UI data structure Weather_XXX on the left



20

Then select the Customer field on the Designer Tab, in the Properties

click on

and in the pop-up select Binding and there the field BusinessPartnerFormattedName and press Ok



21

Step 2: Add a link on your QA to show the map of the entered address

Task

Add a link field on the QA, change the label to “” and change the text (Data Information > Text) to “Map”.

Pass the address as parameter to the map service

Procedure

In the Solution Explorer view, double click on Weather_XXX_QA.QA.uicomponent to open it in the UI Designer Select the Pencil icon to switch to change mode.

In the Toolbox tab Drag&Drop the control Link from the right side to the UI underneath Description on the left



22

On the Properties tab change the label to “”

In the Properties Data Information > Text click on and change the text to “Map”

Pass the address parameter via the property

click on and in the following pop-up Select TextPool and click on Advanced

Add 6 lines in the table with the button and there

Enter the text “map://address=”

Bind via the button the data field Street

Bind via the button the data field City

Bind via the button the data field Country

Enter the text “&title=”

Bind via the button the data field BusinessPartnerFormattedName



23

Press Ok

Save and Activate the QA floorplan

Step 3: Test your modified Floorplans in the iPhone Player

Task Test the modified UI in the player. You should be able to verify the changes you made in the previous step.

Procedure


Enter your Application Password

Logon using your prefilled user and password

You should be able to save and modify newly created objects



24

CODE SNIPPETS

Business Object Weather_XXX.bo

import AP.Common.GDT as apCommonGDT;

import AP.FO.BusinessPartner.Global;

businessobject Weather_XXX {

// Root node must not be specified, it is created implicitly

//

// Add elements here.

//

// To declare an element as alternative key, use the [AlternativeKey] annotation.

// Please note:

// - An alternative key of type UUID exists implicitly for each node, enabling the node

// to be used as an association target.

// - The QueryByElements query is created automatically for each node.

// - Code completion is available with CTRL + SPACE.

element Customer : PartyID;

element City : LANGUAGEINDEPENDENT_LONG_Description;

element ZIP : LANGUAGEINDEPENDENT_SHORT_Name;

element Street : StreetName;

element Country : CountryCode;

element Temperature : LANGUAGEINDEPENDENT_LONG_Description;element Visibility : LANGUAGEINDEPENDENT_LONG_Description;

element RelativeHumidity : LANGUAGEINDEPENDENT_LONG_Description;

element Description : LANGUAGEINDEPENDENT_LONG_Description;

association ToCustomer to Customer;

action GetWeather;

}



25

Script Event-AfterModify.absl

import ABSL;

import AP.FO.BusinessPartner.Global;

var customer : elementsof Customer;

customer.InternalID = this.Customer.content;

this.ToCustomer = Customer.Retrieve(customer.InternalID);

if (this.ToCustomer.IsSet())

{

this.ZIP =

this.ToCustomer.AddressSnapshot.PostalAddressSuitableForLogonLanguage.StreetPostalCode;

this.City =

this.ToCustomer.AddressSnapshot.PostalAddressSuitableForLogonLanguage.CityName;

this.Street =

this.ToCustomer.AddressSnapshot.PostalAddressSuitableForLogonLanguage.StreetName;

this.Country =

this.ToCustomer.AddressSnapshot.PostalAddressSuitableForLogonLanguage.CountryCode;

}

Script Action-GetWeather.absl

import ABSL;

import AP.Common.GDT;

var value;

var startIndex;

var endIndex;

var serviceID : LANGUAGEINDEPENDENT_SHORT_Name;

var parameter : NameAndValue;var parameters : collectionof NameAndValue;

var result ;

var content ;

var returnCode ;

var lat;

var lon;

parameters.Clear();

// Convert ZIP code to latitude / longitude point

// Only for US ZIP codes

// --------------------------------

// Exchange with your Service ID

//

serviceID = "PW00011";

//

// --------------------------------

parameter.Name = "listZipCodeList";



26

parameter.Value = this.ZIP;

parameters.Add(parameter);

result = WebServiceUtilities.ExecuteWebService(serviceID, parameters);

content = result.ResponseContent;

returnCode = result.ReturnCode;

value = result.ResponseContent;

startIndex = value.Find("<latLonList>");

if (startIndex != -1)

{

value = value.Substring(startIndex + 12);

startIndex = value.Find(",");

lat = value.Substring(0, startIndex);

endIndex = value.Find("</latLonList>");

lon = value.Substring(startIndex + 1, endIndex - startIndex - 1);

// Point found, get Weather forecast

parameters.Clear();

// --------------------------------

// Exchange with your Service ID

//

serviceID = "PW00010";

//

// --------------------------------

parameter.Name = "lat";

parameter.Value = lat;


parameter.Name = "lon";

parameter.Value = lon;


parameter.Name = "begin";

parameter.Value =

Context.GetCurrentUserDate().ConvertToGlobalDateTime().ConvertToDate().ToString().Concatenate("T15:0

0:00");


parameter.Name = "end";

parameter.Value =

Context.GetCurrentUserDate().ConvertToGlobalDateTime().ConvertToDate().ToString().Concatenate("T15:0

0:00");


result = WebServiceUtilities.ExecuteWebService(serviceID, parameters);

content = result.ResponseContent;

returnCode = result.ReturnCode;

// Parse XML string



27


startIndex = value.Find("<weather-conditions>");

endIndex = value.Find("</weather-conditions>");

if (startIndex != -1 && endIndex != -1)

{

value = value.Substring(startIndex + 38, endIndex - startIndex - 56);

// this.Description = value;

}


startIndex = value.Find("<name>Relative Humidity");

endIndex = value.Find("</humidity>");


{


this.RelativeHumidity = value;

}

else

this.RelativeHumidity = "?";


startIndex = value.Find("<name>Daily Maximum Temperature");

endIndex = value.Find("</temperature>");


{


this.Temperature = value;

}

else

this.Temperature = "?";


startIndex = value.Find("<name>Cloud Cover Amount");

endIndex = value.Find("</cloud-amount>");


{


this.Visibility = value;

}

else

this.Visibility = "?";

}

else

{

this.RelativeHumidity = "?";

this.Visibility = "?";

this.Temperature = "?";

}



© 2013 by SAP AG or an SAP affiliate company. All rights reserved.No part of this publication may be reproduced or transmitted in any form or for any purpose without the express permission of SAP AG.The information contained herein may be changed without prior notice.

Some software products marketed by SAP AG and its distributors contain proprietary software components of other software vendors. National product specificationsmay vary.

These materials are provided by SAP AG and its affiliated companies (“SAP Group”) for informational purposes only, without representation or warranty of any kind, andSAP Group shall not be liable for errors or omissions with respect to the materials. The only warranties for SAP Group products and services are those that are set forth inthe express warranty statements accompanying such products and services, if any. Nothing herein should be construed as constituting an additional warranty.

SAP and other SAP products and services mentioned herein as well as their respective logos are trademarks or registered trademarks of SAP AG in Germany and othercountries.

Please seehttp://www.sap.com/corporate-en/legal/copyright/index.epx#trademarkfor additional trademark information and notices.

http://www.sap.com/corporate-en/legal/copyright/index.epx#trademark

http://www.sap.com/corporate-en/legal/copyright/index.epx#trademark

Documents

CD165_exercise_solutions.pdf