You can use the Layout section in Inspector to adjust the appearance and position of the corresponding component. In modifying the Original style, you can determine where the component's starting position will be, as well as some other properties such as rotation and visibility.
Note that Layout properties are only relevant for components that have a visual appearence on the multi-touch interface. Components such as Network Sender, Network Receiver or Timer do not show up and therefore have no Layout properties.
Adjusting Layout Properties
Select the corresponding component in the Scene Manager and go the Layout section located under the Properties tab in the Inspector. You can either type the values into the corresponding field, or right-click the field and change the value by moving your mouse while keeping the right mouse button pressed.
- Size: Here you can adjust the size of the component. The values entered represent the number of pixel units. By checking the box to the right, you lock the aspect ratio of the size values so that they will stay proportional regardless of which of the two values you modify.
- Position: Here you can adjust the component's horizontal ("X") and the vertical ("Y") position on the multi-touch surface. If made in the Original style, these values will be the asset's or component's starting position within a scene.
- Rotation: Here you can change the rotation of the component. Enter values positive for clockwise rotation and negative values for counter-clockwise rotation. Note: The Advanced section offers additional settings for rotation and other aspects.
- Scale: Here you can adjust the scale of the component by entering a percentage.
- Tint: Set the color of the asset or component by selecting it from a color palette. For Text assets, the color of the text itself will be changed. For other components, a colored mask will be placed over it, and the selected color will be mixed with the colors of the corresponding component.
- Opacity: Use the slider to adjust the opacity of the component. Moving the slider all the way to the right makes it completely opaque and this is where it is set by default. Moving the slider all the way to the left will make it completely transparent.
- Visible: This option is selected by default, making the component visible within the multi-touch scenario. Deselecting the visible option makes the component invisible.
Working with Layout Properties
Learning to work with Layout properties in Touch Creator is one of the most basic elements of creating a multi-touch scenario. Since Layout properties determine important factors such as the size, position and scale, they are the first property adjustments you're likely to make when adding a new component.
The Size property determines the actual size of the component while the Scale feature zooms it in to the specified percentage scale. This is particularly relevant for styles and actions, which are discussed in their corresponding sections of these help pages.
Color selection may vary by the kind of component you currently have selected. For instance, button components have a border color function.
Concerning visibility, it is essential to note that even though an asset or component may be invisible, it still exists within the multi-touch scenario and may affect interaction depending on other settings.
Some components that by itself have no visible appearance, such as Layers, still have a Visible property. Though changing this property does not affect the appearance of the layer, it will affect child components assigned to it. Making a layer invisible will render all child components invisible.