Optimising Power Apps: the With Function

With great Power (FX) comes great responsibility and in this post I am taking a look at one of the ways we can optimise our Canvas Power Apps by using the ‘With’ function.

I’d like to say thank you to Craig over at Platforms of Power for sharing his experience with using this function and inspiring me to routinely work it in to App approaches!

Why the With?

In this article we’re going to focus on the declarative nature of ‘With’. Without setting a global or context variable, or making multiple calls to a data source, ‘With’ enables us to ingress data into the function and give it a friendly name, and then use the friendly name to perform other tasks – like maths calculations.

This makes it easy to read and understand the Power FX statement. It allows logical application of the statement using descriptive names for the data – ensuring accuracy. It’s also very performant, especially if multiple calls to a data source can be supressed as much as possible.

The values in the With statement are only persistent within the scope of the With statement. For example, if you’ve declared a value named ‘FavouriteColour’, you cannot call that value elsewhere in the App, as it’s only available in the context of the With statement where it was first declared.

Keep in mind that With works with records. A record can be created by the use of curly braces { }.

Scenario

We have a set of students who are proposing the number of hours they can work for us when checking out our teaching rooms each morning for readiness. Each of the students could work as a ‘standard’ room checker, or, we could pay them at the supervisor rate so they can help support the process. We’ve got a budget to adhere to though and it would be helpful to get visual, instant feedback on the amount of pay for each student both per day and per week based on the hours they are available.

I’ve listed the students in a Gallery using a Collection, which contains their Given Name, Surname, Student ID and Proposed Hours.

I added a toggle control, named ‘tgl-embed-Rate’. The false text was changed to Standard Rate and the true text to Supervisor Rate. We don’t need to change any of the other properties on the toggle since we’ll use the With function in the label (and the value of the toggle) to do the calculation.

The With function

The With function is added to a label which contains the calculation on the basis of the value of the toggle.

The function has two parameters: Scope and Formula.

In the first part, Scope, we will collect the data together. In my example, it could be as simple as choosing a value of the current record in the Gallery, such as ‘HoursProposed’. In the second part, I’ve chosen to set RateofPay dependant on whether the toggle is true or false.

In the second part, Formula, we will choose to work with the data, now in the declared names of HoursProposed and RateofPay. I have performed two calculations: total pay for one day (simply HoursProposed * RateofPay), and then total pay for one week (on the basis of 5 days in a week) – same calculation then multiply the total by 5.

With statement in the context of a Gallery in a Canvas App

Craig let me know that a common misconception in the context of 'With' is that it mitigates delegation issues. This is not the case; this function doesn't address delegation. It might be useful to keep this in mind in mind in case you're not prompted in the Studio.

I hope that was an interesting start; I think a few more articles on ‘With’ will be handy to get the most out of it. Let me know what you think in the comments.

References

Craig’s excellent blog at Platforms of Power

With function in Power Aps (Microsoft Lean): With function in Power Apps - Power Platform | Microsoft Learn

The ‘With’ Power FX Statement (ready to paste):

Keep in mind you will need to create the artefacts the statement references, including the Gallery/Collection, etc, for it to work.

With(
 // Scope section   
    {                                          // With requires a record. Using "{" opens the statement for a new record
        HoursProposed: ThisItem.HoursProposed, // Create the item of HoursProposed; set it using the 'HoursProposed' value pertaining to this record
        RateOfPay: If(                         // Create the item of RateofPay; set it using the 'Standard Rate/Supervisor Rate' toggle:
            'tgl-embed-Rate'.Value = true,          // If the 'Standard Rate/Supervisor Rate' toggle ("tgl-embed-Rate") is true...
            10,                                         // True value: 10 (the 'Supervisor Rate')
            5                                           // Else: False value: 5 (the 'Standard Rate')
        )                                      // Close out the If statement
    },                                         // Close out the With record

// Formula section

// Calculate the Total Pay (one day) by applying the formula of Hours Proposed multiplied by (*) Rate of Pay
// Calculate the Total Pay (one week) by using (Hours Proposed multiplied by (*) Rate of Pay) multipled by 5 (for a 5 day business week)

// Wrap both items in explanatory text for the User Interface.

"Total Pay (one day): £" & HoursProposed * RateOfPay & "    
Total Pay (one week): £" & (HoursProposed * RateOfPay) * 5

)                                              // Close out the With function