Viewing the XUI file source

You can view the source codes of the WYSWYG design panel and the code modification can be directly displayed in the design panel. The XML code in the source viewer is formatted in a good manner. On the design panel, there are two views, Design view and Source view as shown in the following figure.

Screen capture shows the Design panel

Design view is for the widget WYSWYG design, and the Source view is for viewing or editing the source code of the XUI file. Perform the following steps to get the overall understanding of this function:

  1. On the design panel, click the Source tab next to the Design tab to check the corresponding code. See the following figure for example.
    Screen capture shows the source code sample
  2. Open the XUI file with the Text Editor and compare the code with that in the previous step. They should be the same.
  3. Modify the source code directly in the Source view, complying with the XML criterion. The changes can take effect on the design panel in the Design view.