Converting a Landscape Power App to Portrait (and Vice Versa)

So, you’ve had a request from the user to convert the whole Power App you’ve built from Landscape to Portrait, except you don’t want to spend hours converting and re-creating it or copy pasting every control.

I feel you, I understand, and I have a solution that is not perfect, but certainly will save you a lot of time.

1. From the Power Apps editor, use Save As to save the .msapp file locally
msapp is the file extension for standalone canvas Apps)

Saving a local copy of the msapp file

2. In Windows File Explorer (or similar Finder tool on Mac), go to your Downloads folder

3. Right-click the File and Extract the file to a folder of the same name with whatever Zip/Archive tool you have installed:
(7zip is a free Archiving/Zip tool you can download here)

Extracting the msapp file

4. Inside that folder, you will see a properties.json file
Open this file with your preferred text editor.

5. The settings you are looking to change here are:

  • DocumentLayoutWidth (swap Width with Height)
  • DocumentLayoutHeight (swap Height with Width)
  • DocumentLayoutOrientation (change to either portrait or landscape)
  • DocumentAppType (change to either Phone or to DesktopOrTablet)
Changing the properties.json values when converting a Landscape Power App to Portrait

6. Save the properties.json file

7. Right click and Save As this Powershell script which we will use to re-combine the files.

8. Go To your Downloads folder, copy that file and paste it into to the Folder you extracted above in Step 3

9. Right Click this script and choose Run with PowerShell

Converting a Landscape Power App to Portrait - running the PowerShell script
R

10. Enter the NAME of the App, which will create a new .msapp file of that name in that folder

Using the PowerShell script
Converting a Landscape Power App to Portrait - the final converted app

11. Open https://create.powerapps.com/ and click Open > Browse for File

12. Navigate to the file we created and click Open

Now you have the Power App .msapp file with the orientation converted from landscape to portrait (or vice versa) and during this converting of the file many of your items will have automatically tried to fit based on this new size, however you will still need to clean up and edit many of the properties (as I said, this just saves a lot of time from having to do EVERY item and instead does a fair number of them for you depending on how you’ve set up the properties of your objects)

As a rule of thumb (and this does not include responsive Apps), it is always best to make your Control Properties as relative items and as percentages of other things, for example using the App Width or Height or the Parent Width or Height, such as:
App.Width * 10%

As I said, I know this isn’t a perfect solution, but if you are in a pinch and need to convert a landscape Power App to portrait or from portrait to landscape then this is a fairly easy way that will also re-size many of your objects automatically.

Add comment