Page Redirect Actions

The Navigate function is used to switch between screens in PowerApps mobile applications.

How do you switch between pages?

By touching/clicking the items on the screen (with the user trigger)
Or automatically after a certain period of time (with a timer).

Usually the OnSelect property is used for all the actions that wanted to be executed the moment we “click”.

As an example, let’s take a look at how we switch to the next page when we click the next button on the page.

The page redirection action for the next button:

Navigate (target page, transition effect) will be written into the OnSelect property of this item.

You of course don’t have to write the Navigate formula to OnSelect all the time. We mentioned that different items have different properties. In this sense, properties like OnCheck, OnVisible, OnChange are used when necessary as well.

The OnCheck property can be used for a check box if you want it to work “the moment it is marked”.

Manage Items Centrally by Using Properties

You might feel the need to manage the items on the screen from a center while developing a Power Apps application. When the properties of a certain item change, the features like the color, size, place can be managed for the related items on all screens.

There are two existing methods for central management.

  1. Method 1: Managing by using the item properties on the formula bar.
    Since the actions are executed through formulas, it is the most stable method. You can use all the features in the Properties window like color, position and size. This method is one of the first actions you need to execute while you’re developing an app. It can be hard to execute this action on an existing app, but it will help to do it.
  2. Method 2: Components (Experimental)
    Since this method is experimental, it doesn’t work in a stable way. Compared to the formula method, it is way easier to use.

Manage Items Centrally with Formulas

You might have heard in a lot of places that Power Apps works with the Excel logic and the formula structure is similar.

We write =A1+A2  into the formula bar in Excel to sum up two cells. In this action, we use the cell names directly in the formula and thus call and sum up the value in the cell directly. This way, whenever the value in the cell changes; the sum value gets recalculated.

When we want to execute the same action on Power Apps, we can use items like Text Box and Label. For example, we can calculate and display the sum of values entered in 2 Textboxes in a Label.

The Label item on the screen is named as Toplam (Sum), and the TextBoxes are named as Sayı1 (Number1) and Sayı2 (Number2).
We can display the sum value by writing the =number1. Text + Number2.Text into the Text property of Sum.

It means: Get the Text data of the Number1 item   +   Get the Text data of the Number2 item.

Right with the same logic of this examples, the item properties can be used in order for the items to imitate each other.
Actually, we are going to execute the action by assigning the properties of an item to another item.

Action Steps

Add two Label items to the screen.

Label1–> will stay as Label1
Label1–> will be renamed as Item_dependentto_Label1

Label1
Its features like fill color, text and border color are changed and thus, it is customized.

Item_dependentto_Label1

The properties are changed with the formulas below for this Label.

Fill –>  Label1.Fill  (Gets the fill color of Label1)
BorderColor–>  Label1.BorderColor  (Gets the border color of Label1)
Text–>  Label1.Text  (Gets the text of Label1)
Width–>  Label1.Width  (Gets the width of Label1)
Height–>  Label1.Height  (Gets the height of Label1)

Like it was written in the formula, this item is now dependent to Label 1. When the features of Label1 change, the dependent item will change.
You can distribute the dependent item to screens with copy-paste.

Manage Items Centrally by Using Components

You might feel the need to manage the items on the screen from a center while developing a Power Apps application. When the properties of a certain item change, the features like the color, size, place can be managed for the related items on all screens.

There are two existing methods for central management.

  1. Method 1: Managing by using the item properties on the formula bar.
    Since the actions are executed through formulas, it is the most stable method.
  2. Method 2: Components (Experimental)
    Since this method is experimental, it doesn’t work in a stable way. Compared to the formula method, it is way easier to use.
    The items on the screen can be standardized with components. 
    In this article, we will be analyzing how to manage items centrally with Components.

Using Components

To use the component feature: go File–> Settings –> Advanced Settings–> Write Components into the search bar on right to find the feature and then activate it.

Managing Items Centrally with Components

Once the components are activated, go back to the application screen. Two menus as Screens/Components are displayed.

We go to the components screen to design the template we want to use. The components are designed as a normal screen. When you use multiple components, naming the components will be important.

After the component is complete go to Screens and when you are in the page where the component will be added; locate the page by choosing Insert–>Custom–>Component1.


The component that has been created is added to the screen as one single item. For this reason, a component can be thought as a background image.
In this sense, while designing the symbol or items a component contains or after it is added to the screen, it doesn’t accept general formulas (like the functions of main page, next, save buttons).

Using Formulas in Components

We need to execute an extra action to give commands to the items on a component. For example, when we want to write the Navigate function into the Previous button on the image; we have to add a Label to the screen. You can complete process by writing the Navigate function into the OnSelect property of this Label.

Scan Codes Easily with a Mobile Device

It is possible to scan a barcode, serial number, Imei number, QR Code and many more codes on a SINGLE screen! You can scan all code types with the advanced code scanning function of Power Apps and integrate them to your system.

We can talk about a lot of benefits of transitioning to the code system with a lot of scenarios like counting, tracking and assigning inventories; library management, registering stocks and products, executing actions quickly in store controls.

You can scan codes on your cellphone camera with the mini app you’ll develop using Power Apps.

Scanning Codes

Thanks to this feature, you don’t need to use any extra scan devices. Go Add–> Media–> Barcode scanner on your mobile phone in order to use the code scanning feature. This action only adds a button to your page, the screen that allows you to scan will not be displayed to you in the app.

You can write the Navigate formula into the OnScan property of the scan button (BarcodeScanner1) and direct to the second screen. This way, when a code is scanned you are directed to the second page.

A Label (barcodeData) is used to show the scanned code, Add button (Button1) to enter data and Gallery to display the data on the second screen.

BarcodeScanner1.Value is written into the Text property Label1.

The function that saves data to the cache is written into the OnSelect property of Button1.
Collect( ScannedBarcodes; {barcode: barcodeData.Text} )

ScannedBarcodes is written into the Items property of Gallery1.

 

You can take a look at this link for the Barcode Scan feature.