Tile View Properties

Tile View Properties

Not supported by TWC

Property icon The Tile View supports the following properties, which are available via the Properties pane and the Canvas script editor. Click next to any property name in the Properties pane to see a short description for the selected property.

See Accessing Screen Objects for more information about how to view control objects in script in the Canvas application.

Categorizing, Sorting, and Finding Properties

You can click (Categorize), click Alphabetize (Alphabetical within Category) or click (Search) within the properties using the features located immediately above the properties list. The search box is useful to help locate a property when an object contains many properties. For clarity, when you enter a search term, items matching your entry string remain displayed and non-matching items are temporarily hidden. Clear the search box to display the full properties list again.

You can expand and collapse each property category by clicking Down arrow or Up arrow next to the group name or simply clicking anywhere in the category heading.

Tile View Properties

The following table describes the property names visible in the Properties pane user interface (UI) and the corresponding script property name.

UI Property	Script Property	Description
Name and Type
Name	ControlName	The Name property specifies the unique identifier for this control. Valid characters are A-Z, 0-9, and underscore (_). Special characters and spaces are not permitted. Names cannot start with a number; an underscore will be prefixed if the control name starts with a number. The default value is the object name and the numeric instance. The control's Name is also displayed on the Controls view of the Screen pane.
Type	ControlType	The read-only Type property displays the type for the control: Button, Chart, CygNet Grid, Edit Box, Object Container, Search Box, Tag Chooser, etc. … The control's Type is also displayed on the Controls view of the Screen pane.
Style		The Style property defines the style sheet applied to an object on a screen. A style sheet consists of a predetermined list of properties and property values configured for a particular control type. Click to reveal a drop-down menu of predetermined styles configured for the selected control. Select a desired style and its properties will be applied to the control. Alternately, you can create a new style based on other property values configured for the control. Or you can select <None> to remove subscription to any style. Styles are created in two ways: In the control's Properties pane. Click (Add a new style based on this control) next to the Style property, after you have configured property values in the Properties pane. See Add a new style based on a control for more information. In the Canvas Settings in the Backstage view. The default style for any control is configured in the Backstage view. See Manage style sheets in the Backstage view for more information. Tip: You can also change a control's Style on the Controls view of the Screen pane.
Location
Height	Height	The Height property specifies the height of the control (or screen). Tip: You can also change the height of a control using the Settings pane (click on the (Settings) to the right of the control in design mode) or on the Controls view of the Screen pane.
Horizontal resize mode	HorizontalResizeMode	The Horizontal resize mode property specifies whether and how the control dynamically moves or resizes horizontally when the screen is resized in run mode. Options include: None — No resizing occurs. Shift — The object will shift horizontally. Expand — The object will expand or shrink horizontally the same number of pixels as the screen. Proportional — The object expands or shrinks proportionally to the screen. The default value is None.
Layer	Layer	The Layer property specifies the name of the layer to which this object is assigned. Layers can be used to show, hide, and edit multiple controls on one layer without affecting controls on another layer. Type the name of the layer into the Layer field (the name can be a previously created layer or a new layer). All layers are listed on the Layers pane, where you can manage the layers for the screen in design mode and run mode. Tip: You can also edit a control's Layer on the Controls view of the Screen pane. Note: Layer visibility can be controlled at runtime via the AddLayer, HideLayer, SetLayerVisibility, and ShowLayer methods on the Screen object.
Lock	IsLocked	The Lock property indicates whether the control is locked to the current position. A locked control cannot be moved via click and drag, or nudged with the arrow keys, or resized. Tip: You can also toggle the lock setting of a control using the Settings pane (click on the (Settings) to the right of the control in design mode).
Vertical resize mode	VerticalResizeMode	The Vertical resize mode property specifies whether and how the control dynamically moves or resizes vertically when the screen is resized in run mode. Options include: None — No resizing occurs. Shift — The object will shift vertically. Expand — The object will expand or shrink vertically the same number of pixels as the screen. Proportional — The object expands or shrinks proportionally to the screen. The default value is None.
Visible	IsVisible	The Visible check box indicates whether the control is visible in run mode. Tip: You can also change a control's Visible setting on the Controls view of the Screen pane.
Width	Width	The Width property specifies the width of the control (or screen). Tip: You can also change the width of a control using the Settings pane (click on the (Settings) to the right of the control in design mode) or on the Controls view of the Screen pane.
X	X	The X property specifies the location of the control along the horizontal axis. Use the up, down, left, and right arrow keys to nudge a control by 1 pixel. Arrow moves a control by 1 pixel. Ctrl+Arrow moves a control by 10 pixels. Ctrl+Shift+Arrow moves a control by 100 pixels. Tip: You can also change the location of the control using the Settings pane; click on the (Settings) to the right of the control in design mode.
Y	Y	The Y property specifies the location of the control along the vertical axis. Use the up, down, left, and right arrow keys to nudge a control by 1 pixel. Arrow moves a control by 1 pixel. Ctrl+Arrow moves a control by 10 pixels. Ctrl+Shift+Arrow moves a control by 100 pixels. Tip: You can also change the location of the control using the Settings pane; click on the (Settings) to the right of the control in design mode.
Z index	ZIndex	The Z index property is used to determine the order in which controls are layered on top of each other. Controls with higher values will draw on top of those with lower values. The newest control added to a screen will always have the highest value and will be the top layer. Two or more controls can be on the same index (layer). Tip: You can also change the Z index of a control using the Settings pane (click on the (Settings) to the right of the control in design mode) or on the Controls view of the Screen pane.
Script
Include in script		The Include in script check box indicates that the control will appear in the objects collection of the screen (if scripting is enabled). To optimize performance, best practice dictates that you only include the controls you need to manipulate via script. Other controls should be excluded. When you add an event to a control, it will be automatically added to script and the Include in script property (and the In Script check box on the Controls view) will be set to True. Tip: You can also change the Include in Script setting on the Controls view of the Screen pane.
Tile View
Background color	BackgroundColor	The Background color property specifies the background color of the screen, object, or control. Click to customize the color using the color picker.
Background color source	BackgroundColorSource	The Background color source property specifies the color source for the background color of the screen, object, or control. Two options are available: Auto — Overrides the background color with a theme-appropriate color (default). Note: Auto is not supported as a color source in TWC screens. If a property specifies Auto for color configuration, the screen will use the <Self> color that is specified in the Canvas file during the publishing process. See Color on TWC Screens. <Self> — The color selected in the Background color property will be used. The default option is Auto.
Display mode	DisplayMode	The Display mode property specifies the method for displaying the data elements in the Tile View. Options include: Single UDC — Data for a single UDC is displayed and a tile will be created for each child of a parent facility Each UDC for facility — Facilities are queried for their associated UDCs and a tile will be created for each one The default value is Single UDC.
Facility sender	FacilitySender GetCygNetFacilitySenders	The Facility sender property specifies the name of the control (or map layer) that will send its facility/facilities to this control. This property is used instead of a facility filter.
Main screen path	MainScreenPath MainScreenFileSource	The Main screen path property specifies the path to the Canvas file that will be displayed when you click (Maximize) to maximize the tile and display a screen at the top of the Tile View when in run mode. Click (Minimize) again to return to the tiled view. To configure the screen path click to open the Open Files dialog box, where you can access: BSS — Indicates that the file is stored in an APPS or BSS folder Local — Indicates that the file is stored in a local or network file-system folder.
Tile height	TileHeight	The Tile height property specifies the height of each tiled Detail control.
Tile width	TileWidth	The Tile width property specifies the width of each tiled Detail control.
UDC	UDC	The UDC property specifies the UDC for which the control is to display data. Click to select a UDC using the Select UDC dialog box.
Display
Bottom information text	BottomInformationText	The Bottom information text property specifies the text that will appear on the bottom information area on the control. The control can display a static text string, such as a label, legend, tooltip, or a dynamic text string based on point or facility attributes. Dynamic text is built using tokens, which can represent real-time CVS point properties, point configuration properties, and facility properties. In run mode, the tokens are replaced with the attribute's value. Click to configure the static text and/or property tokens using the CygNet Property String dialog box. The default value is the %Units% token.
Text	Text	The Text property specifies the text that will appear on the face of the control. The item can display a static text string, such as a label, legend, tooltip, or a dynamic text string based on point or facility attributes. Dynamic text is built using tokens, which can represent real-time CVS point properties, point configuration properties, and facility properties. In run mode, the tokens are replaced with the attribute's value. Click to configure the static text and/or property tokens using the CygNet Property String dialog box. For most controls there is no default. For the Detail, Donut, and Tile View controls the default value is the %Value% token.
Top information text	TopInformationText	The Top information text property specifies the text that will appear on the top information area on the control. The control can display a static text string, such as a label, legend, tooltip, or a dynamic text string based on point or facility attributes. Dynamic text is built using tokens, which can represent real-time CVS point properties, point configuration properties, and facility properties. In run mode, the tokens are replaced with the attribute's value. Click to configure the static text and/or property tokens using the CygNet Property String dialog box. The default value is the %Description% token.
Detail
Color configuration	ColorConfiguration	The Color configuration drop-down contains all options required to specify the color properties of the control. Click to reveal a set of color options where you can specify the source of the color to be used for the elements of the control. The Color configuration box consists of the following options.
Color config > Background color	ColorConfiguration.BackgroundSource ColorConfiguration.BackgroundSelfColor	The Background color property specifies the color used for the background of the control. The color can be sourced from one of three options provided in the Source drop-down menu: The color will automatically follow the selected client theme regardless of the underlying color palette (by selecting Auto). The default value is Auto. The color will be sourced from the point state of the associated point (by selecting Point State). The color can be customized (by selecting <Self>). Options include: For each color property select the Source and Color: Source — Click to reveal three options: Auto — The color will automatically follow the selected client theme regardless of the underlying color palette (by selecting Auto). Where applicable, color-related properties will default to this configuration, allowing them to automatically follow the theme of the current client rather than fixing them to the one used when the screen was created. By using Auto for the color configuration, a screen developer can work in their preferred theme without affecting the presentation of the final screen when displayed by the user—avoiding display problems such as white text over a very light background, etc. Note: Auto is not supported as a color source in TWC screens. If a property specifies Auto for color configuration, the screen will use the <Self> color that is specified in the Canvas file during the publishing process. See Color on TWC Screens. Point State — Select Point State to specify that the source of the color corresponds to the point state color defined for the point represented in the element. The default point state colors for a CygNet system are defined by the system’s point scheme. <Self> — Select <Self> to explicitly configure the color. When <Self> is selected a Color field is automatically displayed beneath the Source field and must be configured. Color — Only displays if the Source is <Self>. Click to customize the color using the color picker. Note: You can override the default point state colors for this element by creating a custom color palette. See Configuring Color Palettes and Color palette for a screen or object for more information.
Color config > Text color	ColorConfiguration.TextColorSource ColorConfiguration.TextSelfColor	The Text color property specifies the color used for the text on the control or map visual. The color can be sourced from one of three options provided in the Source drop-down menu: The color will automatically follow the selected client theme regardless of the underlying color palette (by selecting Auto). The default value is Auto. The color will be sourced from the point state of the associated point (by selecting Point State). The color can be customized (by selecting <Self>). Options include: For each color property select the Source and Color: Source — Click to reveal three options: Auto — The color will automatically follow the selected client theme regardless of the underlying color palette (by selecting Auto). Where applicable, color-related properties will default to this configuration, allowing them to automatically follow the theme of the current client rather than fixing them to the one used when the screen was created. By using Auto for the color configuration, a screen developer can work in their preferred theme without affecting the presentation of the final screen when displayed by the user—avoiding display problems such as white text over a very light background, etc. Note: Auto is not supported as a color source in TWC screens. If a property specifies Auto for color configuration, the screen will use the <Self> color that is specified in the Canvas file during the publishing process. See Color on TWC Screens. Point State — Select Point State to specify that the source of the color corresponds to the point state color defined for the point represented in the element. The default point state colors for a CygNet system are defined by the system’s point scheme. <Self> — Select <Self> to explicitly configure the color. When <Self> is selected a Color field is automatically displayed beneath the Source field and must be configured. Color — Only displays if the Source is <Self>. Click to customize the color using the color picker. Note: You can override the default point state colors for this element by creating a custom color palette. See Configuring Color Palettes and Color palette for a screen or object for more information.
Relative Facilities
Order in type	OrderInType	The Order in type property specifies the attribute value used to represent the order in type (facility ordinal) if the relative facility definition is configured for one. It is possible to have multiple relative facility definition sets with the same definition name. In this case, if the specified Relative link is configured for ordinalization, then you need to configure the attribute value in the box.
Relative link	GetRelativeFacilityLinks RelativeFacilityLink RelativeFacilityLinks	The Relative link property specifies a list of all available relative facility paths. Click to reveal a drop-down menu of all available relative facility definitions (relative links). Select a link from the list. If an order-in-type attribute is specified for the selected link, the Order in type field will display.
Resolve to a relative facility	IsRelativeFacilityResolutionEnabled ResolveRelativeFacility ResolveRelativeFacilityTag	The Resolve to a relative facility check box redirects the source of the facility to a relative facility, overriding the configured source facility. Once selected a list of configured Relative links is displayed. See Using Relative Facilities in Canvas for more information about configuring and scripting relative facility links.
Sparkline
Begin date	DateStart DateStart. properties DateStart.Date DateStart.Day DateStart.DayOfWeek DateStart.DayOfYear DateStart.Hour DateStart.Kind DateStart.Millisecond DateStart.Minute DateStart.Month DateStart.Second DateStart.Ticks DateStart.TimeOfDay DateStart.Year	The Begin date or Start or Start date property specifies the start date and time for a control (or screen or chart or column) for an absolute date and time view window. The format is MM/DD/YYYY hh:mm:ss AM/PM. The default value is the system date and time at which the control was first added to the screen. Click to change the date using the date picker.
Begin relative date	RelativeStart	The Begin relative date or Relative start date or Start property specifies a wildcard string defining the amount of time by which to adjust the start date and time. The space-separated elements in this string must be of the form: "x-#", "x+#", or "x=#" where # is an integer and x is one of the following unit specifiers: y — Year, m — Month, d — Day, H — Hour, M — Minute, S — Second, and # is an integer. T wildcard is also supported and must be in the form: T, T+#, T-#, where T represent today at midnight, T-1 is yesterday at midnight, and T+1 is tomorrow at midnight, etc. Any integer can be used. For example, H-8 represents data from the 8 hours before the current hour, d+3 represents data 3 days after the current day, and d+2 H+1 M+30 represents data 2 days, 1 hour and 30 minutes after the current date and time. d-4 H=6 sets the relative start date and time to four days ago (d-4) at 6:00 a.m. (H=6). See Date and Time Wildcards for more information about adjusting relative time.
End date	DateEnd DateEnd. properties DateEnd.Date DateEnd.Day DateEnd.DayOfWeek DateEnd.DayOfYear DateEnd.Hour DateEnd.Kind DateEnd.Millisecond DateEnd.Minute DateEnd.Month DateEnd.Second DateEnd.Ticks DateEnd.TimeOfDay DateEnd.Year	The End date or End property specifies the end date and time for a control (or screen or chart or column) for an absolute date and time view window. The format is MM/DD/YYYY hh:mm:ss AM/PM. The default value is the system date and time at which the control was first added to the screen. Click to change the date using the date picker.
End relative date	RelativeEnd	The End relative date or Relative end date or End property specifies a wildcard string defining the amount of time by which to adjust end date and time. The space-separated elements in this string must be of the form: "x-#", "x+#", or "x=#" where # is an integer and x is one of the following unit specifiers: y — Year, m — Month, d — Day, H — Hour, M — Minute, S — Second, and # is an integer. T wildcard is also supported and must be in the form: T, T+#, T-#, where T represent today at midnight, T-1 is yesterday at midnight, and T+1 is tomorrow at midnight, etc. Any integer can be used. For example, H-8 represents data from the 8 hours before the current hour, d+3 represents data 3 days after the current day, and d+2 H+1 M+30 represents data 2 days, 1 hour and 30 minutes after the current date and time. d-4 H=6 sets the relative end date and time to four days ago (d-4) at 6:00 a.m. (H=6). See Date and Time Wildcards for more information about adjusting relative time.
Show sparkline	ShowSparkline	The Show sparkline indicates whether to show or hide a sparkline in the Detail control. By default the sparkline presents live data updates at a fixed interval trending data at a real-time pace. Use the other Sparkline (Detail) properties to set the line color, x- and y-axis ranges and min/max values, and date ranges, both relative and absolute.
Sparkline color	SparklineColor	The Sparkline color (or Color) property specifies the color of the sparkline. Click to customize the color using the color picker. Note: The default colors used for a Sparkline series are drawn from a set palette and are therefore not theme-specific. See themes for more information.
Use relative date	UseRelativeTime	The Use relative date check box indicates whether to use relative dates and time for the chart. Use the Begin/Start and End properties to specify the relative date ranges to use in the chart. If Use relative date is unchecked all dates and time will be absolute. Use the Begin/Start and End properties to specify the absolute date ranges to use in the chart.
Alarm Icon
Alarm icon configuration	IconConfiguration IconConfiguration.ColorSource IconConfiguration.Ranges IconConfiguration.Ranges.Count	The Alarm icon configuration property is used to configure the alarm icon that can optionally be included in the upper right corner of the Detail control. If enabled in the Show alarm icon property, a customizable icon can be configured to change color based on point state and change image based on alarm priority. Icons will display only when there is an unacknowledged alarm. Click to configure the icon color source, the associated priority ranges, and the icon image used for each priority in the Configure Alarm Icons dialog box. Configure Icon Color Source, Alarm Priority Ranges, and Custom Icon To enable the alarm icon, do the following depending on the control you are configuring: Alarm Grid — Click Show Alarm Icon Column on the Alarm Priority Icon Ranges dialog box, accessible from the Alarm icon column property Detail Control — Click Show alarm icon in the Properties pane Tile View — Click Show alarm icon in the Properties pane Select the source of the icon's color from the Icon color source drop-down menu, which lists the point states of the associated alarm. Options include: BackgroundColor — Specifies that the source of the icon's color corresponds to the alarm's point state background color (%pointstatebackcolor%) ForegroundColor — Specifies that the source of the icon's color corresponds to the alarm's point state foreground color (%pointstateforecolor%) SingleColor — Specifies that the source of the icon's color corresponds to the alarm's point state single color (%pointstatesinglecolor%). This is the default value. Click New icon to add a new icon to the list of priorities. Configure the desired priority and associated icon for each range: Lowest Priority — Type a value to represent the lower end of the priority range. If you are using the CygNet Standard Point Scheme, the total valid range is 0 to 99, with 0 being the lowest and 99 the highest. Priority Range — This read-only column will automatically update to display the range based on the low value you entered, up to the bottom of the next configured range. For example, 0-24, 25-49, 50-74, 75-99 to represent four ranges from 0 to 99. Icon — There are three options for icon usage: Default icon — Use the default icon provided in Canvas. Custom icon without dynamic alarm color — Optionally, supply a custom icon that does not display alarm color. This could be as simple as different shapes and colors that represent the different alarm priority ranges. For example, a blue circle for 0-49, a yellow warning triangle for 50-74, and a red octagon for 75-99, etc. The custom icon must be a Scalable Vector Graphics (.svg) file. Custom icon with dynamic alarm color — Optionally, supply a custom icon that will also include a substituted alarm color somewhere inside the image. To create a customized alarm Create (or purchase) your own icon. The icon must be a Scalable Vector Graphics (.svg) file. The properties of the SVG image are defined its XML definition. Edit the SVG XML in a text editor and add the string "`alarm-highlight`" to the XML class defining the element of your custom icon that you want to have filled using the color specified in the Icon color source from above. For example, `<circle id="Alarm" class="st2 alarm-highlight" cx="8" cy="8" r="5.5"/>` Save the file to a known location where it can be accessed by Canvas. Browse for the icon file. Click to select a path and file from the Open / Open File / Select File dialog box, where you can access: Or click (Delete row) to remove a selected row as necessary. Click New icon again to add another priority range and repeat the steps described above. Click OK to accept the priority order, ranges, icon and close the dialog box. Click Cancel to close the dialog box without modification. Note: You can override the default point state colors for this element by creating a custom color palette. See Configuring Color Palettes and Color palette for a screen or object for more information. Additional Resources For more information about alarm priority, see Alarms > Alarms Overview > Alarm Priority, Alarm Priority Category, and Alarm Category For more information about point state attributes, see Points > Points Overview > CVS Metadata File > PointStateDefinitions
Show alarm icon	IconConfiguration.ShowIcon ShowAlarmIcon	The Show alarm icon indicates whether to show or hide the alarm icon in the Detail control.
Flip
Flip enabled	EnableFlip	The Flip enabled property indicates whether to enable flipping of the Detail control when clicked.
Object path	ObjectFileSource ObjectPath	The Object path property specifies the path to the object file (.cob) that will be shown on the reverse of the Detail control when flipped. Click to open the Open Files dialog box, where you can access: BSS — Indicates that the file is stored in an APPS or BSS folder Local — Indicates that the file is stored in a local or network file-system folder.
Generic
String	String	The String property specifies a generic string property that can be used when scripting this control. Type a string and reference it in your script as necessary.
Yes/No	YesNo	The Yes/No property specifies a generic Boolean yes/no property that can be used when scripting this control. Click the check box to enable the property and reference it in your script as necessary.

Back to top

Copyright © 2000-2025 CygNet Software (a Weatherford company). All rights reserved.