Creating QR codes in a canvas app can significantly enhance user experience by providing quick access to links and information. QR Codes are the way to go if you want to share a link from a canvas app. In this blog, I will explore two efficient methods to generate QR codes: using the QR Code connector and an open source API, both options use the goqr.me API endpoint. These approaches will help streamline the process and offer flexibility in implementation, catering to various business needs.
Methode 1: Using the QR Code connector
This method utilizes the GoQR (Independent Publisher) connector available in Power Apps to generate QR codes effortlessly.
- Create a new blank canvas app.
- Click on the Data tab and search for QR Code.
- Click on the GoQR (Independent Publisher).
- Then click on GoQR (Independent Publisher) to add the connection.
- Add a Text input.
- Add a button, name the button Create QR Code.
- Set the OnSelect of the Create QR Code button to the following code.
Set(QRCode, 'GoQR(IndependentPublisher)'.Create(TextInput1.Text))
- Add another button, name the button Reset QR Code.
- Set the OnSelect of the Reset QR Code button to the following code.
Set(QRCode, Blank())
- Add an image object.
- Set the image property to the following code.
QRCode
- Type an URL in the text input and click on Create QR Code to generate the QR Code.
- Click on the Reset QR Code button to reset the QR Code.
Methode 2: Generating QR Code via a direct API call
For users who prefer a more direct approach, it is possible to call the goqr.me API directly from Power Apps. This method is flexible and does not require adding a connector.
- Create a new blank canvas app.
- Add a Text input.
- Add a button, name the button Create QR Code.
- Set the OnSelect of the Create QR Code button to the following code.
Make sure the name of the text input is correct.
Set(QRCode, "https://api.qrserver.com/v1/create-qr-code/?size=150x150&data=" & TextInput2.Text)
- Add another button, name the button Reset QR Code.
- Set the OnSelect of the Reset QR Code button to the following code.
Set(QRCode, Blank())
- Add an image object.
- Set the image property to the following code.
QRCode
- Type an URL in the text input and click on Create QR Code to generate the QR Code.
- Click on the Reset QR Code button to reset the QR Code.