How to use Px Properties

A Px Property is a single, named data value that can be referenced by any widget on a Px page. Changing the value of a Px Property instantly changes any widget that references it. Almost any widget property can be linked to and edited by a Px Property. For the following example, you create three labels whose background properties are linked to a single Px Property, and demonstrate how to use that Px Property to edit the background color of all the labels at once.

Note: This document uses the terms "Px Property" or "Px Properties" to refer specifically to Px Properties, and simply "property" or "properties" to refer to the properties of a widget.
  1. Open the Px Properties side bar.
    If the Px Properties side bar is not already visible in the Px Editor, you can open it by using the Side Bars icon (located on the main menu bar).


    This side bar shows a listing of the names and values of all the Px Properties in your Px page, and allows you to add or remove them by clicking the Add or Remove button.
  2. Adding a Px Property
    1. Click Add in the Px Properties side bar and enter alertBackground as the name and gx:Brush as the type.


      Now your Px page has a Px Property named alertBackground, visible in the Px Properties side bar. It initially has the default color for a gx:Brush, which is black.
    2. You edit Px Property values by clicking on them. Click on the value of the Px Property and set the value of the alertBackground Px Property to red.


  3. Applying Px Properties to widgets
    1. Create three Labels with the text of your choosing.


    2. Right-click one of the labels, select Edit Properties to open the Properties dialog box, right-click the background property and choose Link > alertBackground.




      Now, the background of this label is linked to the alertBackground Px Property and takes on its value. Note that its entry in the Properties dialog box is shaded green to indicate that its value comes from a Px Property.
    3. If you have many widgets to link, you can link them in batch as well. In this example, select both the second and third labels, right-click and select Edit Properties. Again, right-click background and choose Link > alertBackground.


      Now, the background of both labels are linked to the alertBackground Px Property and take on its value.
    4. Now that all three Labels are linked to the alertBackground Px Property, you can change alertBackground's value in the Px Properties side bar, and all three Labels will instantly receive the new value. Click the value (red) next to alertBackground and change it to another color of your choice (for example, lime).


      The background of all three labels instantly changes.