Text Element

Text Elements display information to you user; they can appear in various styles and weights, but cannot be edited by your user.  Text elements can help guide your user as logical headings, or as helpful descriptions. 

Text Elements vs. Text Fields
Text elements are read-only: your user cannot interact with them.  Text Fields, on the other hand, can be edited by your user.

Text Element Properties

Name	A name which is referenced to on the left tree and rules. The name must be unique to the configurator.
Visible	Specifies whether this element and its contents are shown to the user by default or not. This property can be changed in the visibility rules.
Style	The size of the font.
Color	The color of the text.  You can select from any of the colors defined in the current theme applied to your environment's settings.
Weight	The thickness of the font strokes.
Value	The characters you want to display.

Remember that any of these properties can be modified run-time through Snap rules.  Snap offers many ways to manipulate text.

Position

Container-based position properties appear for this interface element when it is placed within a container, giving you more control over it's position. If you place this UI element within a container, the following properties will appear. Remove it from the container, and these properties will disappear. Furthermore, the actual position properties themselves change, depending on that parent container's Item Layout.

• Not seeing any of the "Position" properties below for this UI element?
  Place this element into a container, and then return to this element's properties list. The "Position" accordion will now appear in the properties list.
  
• Not seeing the right kinds of "Position" properties for this UI element?
  Change the parent container's item layout to horizontal, vertical, or absolute. Then return to this UI element. The position properties available for items within that layout (marked by green checkmarks below) will appear.

Property	Available in a horizontal layout	Available in a vertical layout	Available in an absolute layout	Available in an absolute layout
Relative Size				auto (default) sizes the item just large enough to be drawn on-screen and no more.  The item's size is independent: No size relation exists between this item and any other items in the container. x1-x6 sizes this item in relation to any other items in the container that also have an x1-x6 relative size. For example, if a "First Name" field has a size of x1, and a "Last Name" field also has a size of x1, then they will be the same size. Change "Last Name" to x2 to make it twice the size of the "First Name" field. The item's size is dependent on other items in the container: change the xN size of another item, or change the items in the container, and this item's size changes slightly to continue to follow the size relations you've defined. When using relative sizes, try setting all items within the container to the relative size of "x1" as a starting point, and then adjust the xN levels as necessary. Mixing items with "auto" and "xN" settings is allowed, but may be difficult to manage.
Alignment				Controls how this item within a container is aligned in the cross axis of the container's layout. If the parent container's ItemLayout is set to horizontal, then this controls the vertical alignment of the items. If the parent container's ItemLayout is set to vertical, then this controls the horizontal alignment of the items. stretch the item will stretch across the entire cross axis, if possible. If the item size cannot be adjusted, it will appear centered. start the item will appear at the start of the cross axis center the item will appear in the center of the cross axis end the item will appear at the end of the cross axis
Left Top Right Bottom Width Height				The distance between the edge of the parent container and this element. By default, each is "auto". Usually, you would set only 2 of these properties, leaving the rest to "auto", or you may distort this image or element. For example, to align an item's upper-right corner to the upper-right corner of the parent container, set "Top" to 0px, and "Right" to 0px, leaving all other distances to "auto".
Opacity				The visibility of items or backgrounds behind this item. Use any decimal number from 0 to 1. Set to 0 to make this item completely transparent. Set to 1 to make the item completely opaque.
Order				Specifies the order in which this item is drawn in the container. Use a whole number, such as 0 or 132. Default: 0. Larger numbers are drawn later, and appear closer to the user. Numbers are relative to each other: an item with order "3" will be drawn before an item with order "4".  Order numbers do not need to be consecutive: the next item could have order "50". Order numbers do not need to be unique: if two items have the same order number, such as "0", they will be shown in the order they are defined in the design tree.
Use Zero Padding				By default, UI elements have some padding around them for legibility on all devices, and for ease of use on touch-enabled devices. However, in some cases you may want specific UI elements to have no padding around them at all (to touch each other). This can be useful to create a portion of your UI which needs a very high information density. For example, to create a grid of fields that appear like cells in a spreadsheet.