Search

User Manual

GETTING STARTED


MODULES AND PLATFORM


APPENDIX


TUTORIALS & HELPFUL TRICKS


GLOSSARY


STRATEGIC PARTNER LINKS

Sepasoft - MES Modules
Cirrus Link - MQTT Modules

RESOURCES

Inductive University
Ignition Demo Project
Knowledge Base Articles
Forum
IA Support
SDK Documentation
SDK Examples

ALL USER MANUAL VERSIONS

Ignition 8.1
Ignition 7.9
Ignition 7.8

Deprecated Pages

Skip to end of metadata
Go to start of metadata
General

Component Palette Icon:



IULocgo


Template Canvas

Description

The template canvas is similar to the template repeater but allows for more control of the templates than the template repeater.

The Templates property on the template canvas is a dataset. Each row in this dataset represents a manifestation of a template. It can be the same template or a different template on each row. This dataset allows for control over the size, position and layout of the template. There are two methods of controlling the layout of each template inside the template canvas:

  • Absolute Positioning - The location of the template is explicitly managed through the "X" and "Y" columns of the Templates property's dataset. Consequently the columns labeled Width and Height control the size of the template.
  • Layout Positioning - The template canvas uses "MiGLayout" to manage the location of the template. MigLayout is a common albeit complicated layout methodology. It supports layouts that wrap the templates automatically as well as docking the template to one side of the template canvas. You can learn more about MiG Layout at http://www.miglayout.com

In addition, control over data inside each template can be achieved by adding a column with the name Parameters to the dataset and populating this column with dictionary style key words and definitions.

Additional templates can be added to the template canvas by inserting an additional row to the Templates property's dataset. The same applies to removing the templates but with removing the rows from the dataset.

Properties
NameDescriptionProperty TypeScriptingCategory
Background ColorThe background color of the component. Can be chosen from color wheel, chosen from color palette, or entered as RGB or HSL value. See Color Selector.Color.backgroundAppearance
Border

The border surrounding this component. Options are: No border, Etched (Lowered), Etched (Raised), Bevel (Lowered), Bevel (Raised), Bevel (Double), Button Border, Field Border, Line Border, and Other Border.

The border is unaffected by rotation.

Border.borderCommon
Layout ConstraintsThe overall layout constraints for the canvas.String.layoutConstraintsBehavior
NameThe name of this component.String.nameCommon
QualityThe data quality code for any Tag bindings on this component.QualityCode.qualityData
Scroll BehaviorControls which direction(s) the canvas will scroll in.int.scrollBehaviorBehavior

Show Loading

The following feature is new in Ignition version 8.0.6
Click here to check out the other new features

If false, the loading indicator will never be shown.

boolean

.showLoading

Appearance

TemplatesA dataset containing a row per template to instantiate.Dataset.templatesData
VisibleIf disabled, the component will be hidden.boolean.visibleCommon
Deprecated Properties
Data QualityThe data quality code for any Tag bindings on this component.int.dataQualityDeprecated
Scripting
Scripting Functions
 .getAllTemplates()
  • Description

Returns a list of the templates that comprise the template canvas.

  • Parameters

Nothing

  • Return

List - A list of VisionTemplate definitions. Each instance in the canvas will return its definition's name. The names of each instance can be accessed with getInstanceName(). Individual components in each instance can accessed with getComponent().

  • Scope

Client

 .getTemplate(name)
  • Description

Obtains the designated template object from the template canvas.

  • Parameters

String name- The name of the template as defined by the "name" column of the dataset populating the template canvas.

  • Return

VisionTemplate - Returns the template instance. Properties on the instance can be access by calling .propertyName

  • Scope

Client

Extension Functions
 initializeTemplate
  • Description

This will be called once per template that is loaded. This is a good chance to do any custom initialization or setting parameters on the template.

  • Parameters

Component self- A reference to the component that is invoking this function.

Vision Template template - The template. The name of the template in the dataset will be available as template.instanceName

  • Return

Nothing

  • Scope

Client

Event Handlers
 propertyChange
 propertyChange

Fires whenever a bindable property of the source component changes. This works for standard and custom (dynamic) properties.

.sourceThe component that fired this event
.newValueThe new value that this property changed to.
.oldValueThe value that this property was before it changed. Note that not all components include an accurate oldValue in their events.
.propertyName

The name of the property that changed.

Remember to always filter out these events for the property that you are looking for! Components often have many properties that change.

Customizers

This component has its own customizer called the Template Canvas Customizer. The Template Canvas Customizer allows you to create multiple instances of a template. Here is where you can configure some of the properties of the template instance that are inside the Template Canvas. To edit a template instance, select it from the Instances list. To cancel your edit and add a new instance instead, click the Cancel button in the bottom left.
 

Templates Property

The "Templates" property, in the Property Editor, stores all the data that is entered into the customizer. New template instances can be created directly on the "Templates" property as well. To edit or view the dataset, click the Dataset Viewer next to the "Templates" property.

Template Canvas Customizer - Property Description

PropertyDescription
InstancesA list of the templates currently in the Template Canvas.
Add/Edit InstancesSection of the Template Canvas Customizer where you add new instances and edit existing instances. Select an instance from above to edit that instance.
NameName of the selected template instance.
Z-IndexThe index position along the Z axis that should be used for the instance. If left empty, then Z order will be determined by the row index position of the instance as it sits in the Template Canvas' Templates property. 
Template

The template path for the selected template instance.

Absolute Positioning

Sets the position and size of the components inside the template. In order from left to right, the four boxes are X, Y, Width, and Height.

Layout PositioningUses MiGLayout to manage template location. It allows you to easily determine the layout of components or templates within a container (i.e., "span,wrap"). To learn more, go to http://www.miglayout.com
ParametersShows a list of all the parameters that are defined in the selected template. Specify the values for each template parameter. To make this dynamic, you must bind the Templates property of the Template Canvas.

More information on the Template Canvas Customizer can be found on the Component Customizers page. 

Data Types and the Parameters Field

The "Parameters" field in the customizer accepts string values, but attempts to convert the value if the underlying template parameter is set to a non-string type. In some cases this may require special formatting on the supplied string. The table below provides some examples. 

Data TypeExpected FormatFormat Examples
Color

Colors may be entered in as either a name, or an RBG string

red
0,0,255
Date

Date objects may be entered as either a UNIX timestamp in milliseconds, or in the following notation. In all cases, quotation marks should not be added.


yyyy-MM-dd HH:mm:ss.SSS
yyyy-MM-dd
MM/dd/yyyy
MM/dd/yyyy HH:mm:ss
hh:mm:ss a
hh:mm a
MM/dd/yyyy hh:mm:ss a
yyyy-MM-dd HH:mm:ss.SSS
yyyy-MM-dd HH:mm:ss
EEE MMM dd HH:mm:ss z yyyy 
1591374627000
2020-03-28 06:38:00:000

Examples
Code Snippet
#This example demonstrates how to pull value information from templates that are inside the template canvas.
#This example assumes that each template has a custom property called ContentValue
 
#Get all the template instances of the canvas.
templates = event.source.parent.getComponent('Template Canvas').getAllTemplates()    

#The templates are a list therefore you can iterate through them.
for template in templates:		

	#You can access the properties of the template. This example prints the ContentValue custom property to the console.
	print template.ContentValue		
Code Snippet - Seach by Name
#This example demonstrates how to iterate through each template in a template canvas
#looking for a named instance. Once found, print the value of a property on a component in 
#that instance. 
 
#This assumes that the canvas contains a template instance named "timerTemplate" and
#a Timer component (named Timer) is inside the instance. 
 
#Create a reference to the Template Canvas
canvas = event.source.parent.getComponent('Template Canvas') 
 
#Retrieve all template instances in the canvas
tempInstance = canvas.getAllTemplates()

#Iterate through each template instance
for template in tempInstance:
 
	#Compare the name of each instance.
	if template.getInstanceName() == "timerTemplate":
 
		#Print the Value property on the Timer component inside the template
		print template.getComponent("Timer").value
Code Snippet - Read User Input Example
#This script will retrieve a list of all templates in a template canvas, and record user input. 

#The code is designed to work with the a User Input example,
#but can be easily modified to work with different templates.

#Reference the template canvas component, and call the getAllTemplates() method. 
#This will return a list of every instance in the canvas 
templateList = event.source.parent.getComponent('Template Canvas').getAllTemplates()

#Initialize a list. User input from each text field will be stored in this variable
userInput = []

#Iterate through each template instance inside the canvas
for template in templateList:
	
	#add the user inputted value to the userInput list. The values are originally returned in Unicode.
	#the Python str() function is casting the Unicode values as string values. 
	userInput.append(str(template.TextField_Text))
	
#Show the values in a messageBox. This could be replaced with an INSERT query, or some other action. 
#str() is used again to case the list as a string. This only required to work with the messageBox function 
#since the function requires a string argument be passed in
system.gui.messageBox(str(userInput))

Related Topics ...



  • No labels