Difference between revisions of "Component Properties"

From Flowcode Help
Jump to navigationJump to search
 
(42 intermediate revisions by 2 users not shown)
Line 1: Line 1:
<sidebar>Sidebar: Taking Flowcode Further</sidebar>
+
[[File:Gen_Scale_Arc_Component_Properties_01.png|right|frameless]]
[[File:Gen_LEDarray_Properties_01.png|right]]
+
'''Component properties''' controls how the [[Component|component]] functions as well as how it is displayed and where it is situated on the [[System Panel]] or [[Dashboard Panel]].
'''Component properties''' controls how the [[Component|component]] functions as well as how it is displayed and where it is situated on the [[System Panel]] or [[Dashboard Panel]], you can directly alter the location of the component using the 'World coordinates' under the 'Position' section of the [[Properties Panel]], you can also manipulate the component by using the 'Scale' section to change the size (and shape) of the component as well as the 'Rotation' section to rotate the component in the panel.
+
 
 +
 
 +
You can directly manipulate the component by using the [[Object Position|Position]] section of the [[Properties Panel]] when the component is selected, here you can change the location of the component by altering the [[Object Coordinates|Coordinates]], you can also change the [[Object Scale|Scale]] of the component and even manipulate the component's [[Object Rotation|Rotation]] on the panel, this can all be done relative to [[Local and World Space]].
  
  
 
To bring up a components attributes and properties you can right click on a selected component and click 'Properties' from the context menu.
 
To bring up a components attributes and properties you can right click on a selected component and click 'Properties' from the context menu.
[[File:Gen_Component_Context_Menu_Properties_LEDarray.png|center]]
+
 
 +
<gallery perrow="4" style="text-align:center;">
 +
File:Gen_Component_Context_Menu_Properties_LED Array.png
 +
File:Gen_LED_Array_Properties_01.png
 +
File:Gen_LED Array_Properties_Connections_01.png
 +
File:Gen_LED Array_Properties_Connections_Custom_Pins_01.png
 +
File:Gen_Component_Context_Menu_Properties_7Seg_Single.png
 +
File:Gen_7Seg_Single_Properties_01.png
 +
File:Gen_7Seg_Single_Properties_Connections_01.png
 +
</gallery>
 +
 
 +
 
 
This will bring up the 'Properties Panel' (as displayed to the right), there you can see the components attributes and properties.
 
This will bring up the 'Properties Panel' (as displayed to the right), there you can see the components attributes and properties.
  
Line 12: Line 25:
  
 
The properties for the component can be edited in the Properties Panel by simply clicking the property value and/or typing in a value, this depends on the component and the property, many components have similar properties and some serve a completely different purpose because of the radical difference between some components.
 
The properties for the component can be edited in the Properties Panel by simply clicking the property value and/or typing in a value, this depends on the component and the property, many components have similar properties and some serve a completely different purpose because of the radical difference between some components.
 +
[[File:Gen_Scale_Arc_Component_Properties_01.png|right|frameless]]
 +
  
[[File:Gen_LEDarray_Properties_Connections_02.png|right]]
 
 
[[File:Gen_Scale_Arc_Component_01.png|left]]  
 
[[File:Gen_Scale_Arc_Component_01.png|left]]  
[[File:Gen_Scale_Arc_Component_Properties_01.png|left]]
 
  
There are many different properties used in a range of different components, take the [[Component Scale Arc|Scale Arc]] component for example, this offers a vast range of properties to customize the appearance and function of the component.  
+
There are many different properties used in a range of different components, take the [[Component: ID f307403b 2134 4efa bfac bbd0adc0f253|Scale Arc]] component for example, this offers a vast range of properties to customize the appearance and function of the component.  
  
  
The Scale Arc component properties allow you to change the colour of the negative and positive markings, labels and backgrounds as well as the resolution and shape of the canvas.  
+
The [[Component: ID f307403b 2134 4efa bfac bbd0adc0f253|Scale Arc]] component properties allow you to change the colour of the negative and positive markings, labels and backgrounds as well as the resolution and shape of the canvas. There are many other properties available to change to customize the component to suit your desired purpose, you can change nearly every aspect of the Scale Arc just by changing the properties of the component.
  
There are many other properties available to change to customize the component to suit your desired purpose, you can change nearly every aspect of the [[Component Scale Arc|Scale Arc]] just by changing the properties of the component.
+
The broad range of properties makes the component an excellent component base got creating or further improving existing components by adding the component or tying in its functionality with different components. By having so many different component properties readily available from the get go, it allows you to create create a robust and complex component which can be suitable for many different purposes and use in different fields entirely due to the wide range of functionality available.
  
  
Line 30: Line 43:
  
  
For extra information on specific components search for the component name or GUID using this wiki or use the [[Component List]] page to browse through and find components.
+
==Video instructions==
 +
 
 +
For detailed video instructions see the [http://www.youtube.com/watch?v=k-J6pCYkEk0&list=PLQDWBb7bxuCgg6aJgPJcfXBMzZdLILceQ Component Properties] video to for a comprehensive walk-through for using Component Properties which shows available functionality of the [[Project Explorer]] to enhance components and objects.
 +
 
 +
<div align="center">
 +
{{#ev:youtube|k-J6pCYkEk0|640}}
 +
</div>
 +
 
 +
 
 +
==Standard Features==
 +
 
 +
===Properties and Position===
 +
 
 +
The Properties tab contains the various properties for the selected panel component or object and used to specify the operation of the component or object.
 +
 
 +
The Position tab contains the various position and scale properties for the selected panel component or object and used to specify to location and size of the component or object on the panel.
 +
 
 +
[[File:Props_PropPos.jpg]]
 +
 
 +
 
 +
===Properties and Categories===
 +
 
 +
With the Panel root object selected you can add your own properties and categories to allow your program to easily customised to run in different types of ways. This then plugs into the component creation interface to allow your custom properties to appear when your exported component is selected.
 +
 
 +
[[File:Props_Edit.jpg]]
 +
 
 +
 
 +
===Component Renaming===
 +
 
 +
A component or object can be given a specific name by selecting the object on the panel and then editing the name in the Handle field of the properties window.
 +
 
 +
[[File:Props_Rename.jpg]]
 +
 
 +
 
 +
==Advanced Features==
 +
 
 +
===Visible, Interactive and Solid===
 +
 
 +
There are a number of Flags available to determine how the component or object will react in the system.
 +
 
 +
Visible - Determines if the component or object can be seen.
 +
 
 +
Interactive - Determines if the component or object can be used to collect mouse events such as clicks or drags.
 +
 
 +
Solid - Determines if the component or object will work with the panel collision system.
 +
 
 +
[[File:Props_Flags.jpg]]
 +
 
 +
 
 +
===Position Locks===
 +
 
 +
There are an additional number of position lock Flags available to determine how the component or object will react in the system.
 +
 
 +
The Locks are only available when the Panel root object is selected allowing you to apply the rule to all the components and objects within your current project. If you then export the project as a component then the component will be initialised with the lock settings.
 +
 
 +
Aspect Ratio - Determines if the component or object can be none uniformly scaled.
 +
 
 +
Coordinates - Determines if the component or object can be moved around on the panel.
 +
 
 +
Size - Determines if the component or object can be scaled or re-sized.
 +
 
 +
Rotation - Determines if the component or object can be rotated on the panel.
 +
 
 +
[[File:Props_Locks.jpg]]
 +
 
 +
 
 +
===Properties names and variables===
 +
 
 +
For the ability to display the property names as variables you can click on the properties heading to get a menu.
 +
 
 +
[[File:Props_NameVsVar.jpg]]
 +
 
 +
 
 +
===Metrics===
 +
 
 +
With the Panel root object selected you can configure what measurement scale the world space is represented in allowing very small to very large objects to work together.
 +
 
 +
[[File:Props_Metrics.jpg]]
 +
 
 +
 
 +
===Coordinates world and local===
 +
 
 +
For the ability to display the coordinate properties in respect to local space or world space you can click on the coordinates heading to get a menu.
 +
 
 +
[[File:Props_WorldVsLocal.jpg]]
 +
 
 +
 
 +
===Scales world size, local size and local scale===
 +
 
 +
For the ability to display the scale properties in respect to world size, local size or local scale you can click on the scale heading to get a menu.
 +
 
 +
[[File:Props_Scales.jpg]]
 +
 
 +
 
 +
===Rotations Euler angles and quaternions===
 +
 
 +
For the ability to display the rotation properties in Euler angles or quaternions you can click on the rotation heading to get a menu.
 +
 
 +
[[File:Props_Rotations.jpg]]
 +
 
 +
 
 +
==Further information==
 +
 
 +
For extra information on specific components see the [[Component Help Files]] on the wiki by searching the component name, the globally unique identifier (GUID) or by using the [[Components]] page to browse through and find components.
 +
 
 +
 
 +
See the [[Component]] article for extra information on the role of components and how they are integrated into Flowcode, you can also look at other articles throughout the wiki to see various methods and techniques to use and create components.

Latest revision as of 08:05, 2 July 2019

Gen Scale Arc Component Properties 01.png

Component properties controls how the component functions as well as how it is displayed and where it is situated on the System Panel or Dashboard Panel.


You can directly manipulate the component by using the Position section of the Properties Panel when the component is selected, here you can change the location of the component by altering the Coordinates, you can also change the Scale of the component and even manipulate the component's Rotation on the panel, this can all be done relative to Local and World Space.


To bring up a components attributes and properties you can right click on a selected component and click 'Properties' from the context menu.


This will bring up the 'Properties Panel' (as displayed to the right), there you can see the components attributes and properties.

If the Properties Panel is already being displayed simply click on a component to bring up it's properties on the panel.


The properties for the component can be edited in the Properties Panel by simply clicking the property value and/or typing in a value, this depends on the component and the property, many components have similar properties and some serve a completely different purpose because of the radical difference between some components.

Gen Scale Arc Component Properties 01.png


Gen Scale Arc Component 01.png

There are many different properties used in a range of different components, take the Scale Arc component for example, this offers a vast range of properties to customize the appearance and function of the component.


The Scale Arc component properties allow you to change the colour of the negative and positive markings, labels and backgrounds as well as the resolution and shape of the canvas. There are many other properties available to change to customize the component to suit your desired purpose, you can change nearly every aspect of the Scale Arc just by changing the properties of the component.

The broad range of properties makes the component an excellent component base got creating or further improving existing components by adding the component or tying in its functionality with different components. By having so many different component properties readily available from the get go, it allows you to create create a robust and complex component which can be suitable for many different purposes and use in different fields entirely due to the wide range of functionality available.


A lot of components rely on other components, and some components are only used to support other components, such components as the Button helper and switch base, are used to create and enhance components to add extra functionality which may even require and rely on these components to function.

Other components such as the LCD and 7-Segment Displays require components which can alter a variable to input a value for the component to display, these components are not as reliant as others and can be changed by altering the variables whilst running the flowchart, rather than using other components to change the variable value.


Video instructions

For detailed video instructions see the Component Properties video to for a comprehensive walk-through for using Component Properties which shows available functionality of the Project Explorer to enhance components and objects.

{{#ev:youtube|k-J6pCYkEk0|640}}


Standard Features

Properties and Position

The Properties tab contains the various properties for the selected panel component or object and used to specify the operation of the component or object.

The Position tab contains the various position and scale properties for the selected panel component or object and used to specify to location and size of the component or object on the panel.

Props PropPos.jpg


Properties and Categories

With the Panel root object selected you can add your own properties and categories to allow your program to easily customised to run in different types of ways. This then plugs into the component creation interface to allow your custom properties to appear when your exported component is selected.

Props Edit.jpg


Component Renaming

A component or object can be given a specific name by selecting the object on the panel and then editing the name in the Handle field of the properties window.

Props Rename.jpg


Advanced Features

Visible, Interactive and Solid

There are a number of Flags available to determine how the component or object will react in the system.

Visible - Determines if the component or object can be seen.

Interactive - Determines if the component or object can be used to collect mouse events such as clicks or drags.

Solid - Determines if the component or object will work with the panel collision system.

Props Flags.jpg


Position Locks

There are an additional number of position lock Flags available to determine how the component or object will react in the system.

The Locks are only available when the Panel root object is selected allowing you to apply the rule to all the components and objects within your current project. If you then export the project as a component then the component will be initialised with the lock settings.

Aspect Ratio - Determines if the component or object can be none uniformly scaled.

Coordinates - Determines if the component or object can be moved around on the panel.

Size - Determines if the component or object can be scaled or re-sized.

Rotation - Determines if the component or object can be rotated on the panel.

Props Locks.jpg


Properties names and variables

For the ability to display the property names as variables you can click on the properties heading to get a menu.

Props NameVsVar.jpg


Metrics

With the Panel root object selected you can configure what measurement scale the world space is represented in allowing very small to very large objects to work together.

Props Metrics.jpg


Coordinates world and local

For the ability to display the coordinate properties in respect to local space or world space you can click on the coordinates heading to get a menu.

Props WorldVsLocal.jpg


Scales world size, local size and local scale

For the ability to display the scale properties in respect to world size, local size or local scale you can click on the scale heading to get a menu.

Props Scales.jpg


Rotations Euler angles and quaternions

For the ability to display the rotation properties in Euler angles or quaternions you can click on the rotation heading to get a menu.

Props Rotations.jpg


Further information

For extra information on specific components see the Component Help Files on the wiki by searching the component name, the globally unique identifier (GUID) or by using the Components page to browse through and find components.


See the Component article for extra information on the role of components and how they are integrated into Flowcode, you can also look at other articles throughout the wiki to see various methods and techniques to use and create components.