How to use calculation and summary functions in the Canvas App Builder

Canvas apps can do the math for you.   We have two key features available within the App Builder that allow you to do complex mathematical functions as well as pull forward summary numbers from previous screens. These two features are called Calculation and Summary in the palette on our app builder.  

Tutorial

Let's build a simple sales order application, where a sales person could sell a product and have Canvas break out the sub totals, calculate the tax and provide the bottom line price.  

1. Go to your My Apps page.
2. Click to Edit an existing app or Create New App.
3. Name your app and add a new screen.
4. Hover over the screen in the App Outline and click to Loop the screen.

Loop Screen.

Creating a Calculation

1. Add a Short Text field and label it "Product Description."
2. Drag a Number field from the palette into the middle of the screen.  You can label this "Cost."  Open the Field Settings for Cost and select Currency in the Style drop down.

Currency Style

3. Add another Number field to your app.  You can label this "Quantity."
4. Now add a Calculation field and label it "Subtotal."  Open the Field Settings and look for the Calculation section.
5. Select the Cost field then the Add Field option.  Select Multiplication then select the Quantity field in the final drop down.

Calculation

NOTE: You will use Add Field when creating mathematical functions with fields in your app.  Use Add Constant to calcuate a function with a constant (static) number.​​  You can use multiple fields and constants in a single calculation field.

Adding a Summary Field

You will use a Summary field when pulling values from one screen to another OR summarizing values in a looped screen.

1. Add a new screen to your app and name it "Order Summary."
2. Drag a Summary field from the palette into the app.  You can label this "Product Total."
3. Open the Field Settings for the Summary field.  Select the Summary Screen.  This is the screen that contains the information you are pulling from.  Next select the Summary Entry.  This is the field that you are pulling information from. In this example, the Summary Screen is "Materials" and the Summary Entry is "Subtotal."

Summary field

Adding Tax to the Total

1. On the "Order Summary" screen add a new Calculation field and label it "Tax."
2. In the Field Settings for the calculation, select Product Total then Add Constant.  Select * (Multiplication). As the constant value, add your tax percentage in decimal format.  In this example, we will use 7.5% or .075. You'll also have to click the X on the field calculation that is already present.

Tax calculation

3. Add a final Calculation field to your app and label it "Order Total."
4. Select "Product Total" in the calculation settings then Add Field to add "Tax."

Example

Here is an example of calculations and summary fields on a mobile device. On the Materials sceen below - the item total is calculated by multiplying Qty by Price.

On the next screen, the Materials Total and Labor Total are summarized, and the Tax and Grand Total are calculated.

In summary, to use the calculation and summary functions first open up an app in the app builder. For a calculation add a calculation field. From there you can choose which fields and constants along with simple mathematical operations to create a calculation. A summary can be made by adding a summary field. Choose the screen that the field you would like to summarize is on and then the field. 

If you have any questions about Canvas or need help replacing paper based forms with an Android or Apple device, please don't hesitate to contact us.