YAML Code view in Canvas Apps

With the Microsoft announcement of Code view in Power Apps Studio, developers can not view and use the source code in YAML format and Power FX format. This allows selection of particular controls and see the YAML code that makes up that control.

If you require to replicate the same control or create a similar control with similar properties, you can copy the YAML code, modify it in your favorite editor such as Visual Studio Code and then paste the YAML to the application. The screenshot below shows the two available options for viewing or copying YAML code:

The view code option will display the YAML code in a dialog window, allowing you to also copy the code if you want from there.

Once the code is copied, you can make changes to the code in your favorite editor, such as Visual Studio Code.

You can then copy the code from your editor, and paste in directly into your Canvas application.

Once the code is pasted, you will see the new button appearing on the screen.

The finalized code can be seen by showing the code of the Screen itself as shown below:

Screens:
  Screen1:
    Children:
      - ButtonCanvas1:
          Control: Button@0.0.44
          Properties:
            Font: =Font.'Segoe UI'
            FontSize: =18
            Height: =62
            Icon: ="Add"
            IconStyle: ='ButtonCanvas.IconStyle'.Filled
            Text: ="Add New Record"
            Width: =220
            X: =40
            Y: =40
      - ButtonCanvas2:
          Control: Button@0.0.44
          Properties:
            Font: =Font.'Segoe UI'
            FontSize: =18
            Height: =62
            Icon: ="Delete"
            IconStyle: ='ButtonCanvas.IconStyle'.Filled
            Text: ="Delete Record"
            Width: =220
            X: =40
            Y: =127

For more information about this feature, you can view this on the Microsoft Learn page.