Property Affectors

Property Affectors are an advanced feature that allow modification of the properties of elements according to the distance between them and other elements in the room.

For example, you can set up an Image element that functions as a candle, and modifies the brightness of other elements in the room based on how far they are from the candle:

To set up a Room similar to this example, first create the Triangle, Circle, and Rectangle shapes in the Room:

Then add an Image element and choose any asset you want to represent your light source. Now find the Property Affectors setting under the Advanced category:

When you click the icon, it'll bring up a dialog that lets you set up how this Image element will affect other elements in the Room:

The first dropdown allow you to specify the property that should be affected on other elements in the Room. For this example, you can select Brightness:

The next dropdown lets you select which "direction" the distance will be measured:

Radial means the distance is at any angle between the element affecting others (the candle) and the elements being affected (the shapes). X Axis only calculates the distance based on the x-axis of the Room (left to right). Y Axis only calculates the distance based on the y-axis of the Room (top to bottom). For this example, Radial is appropriate.

The third input lets you specify the distance the affector applies to. This is specified in the pixel coordinates of the Room:

In this example, we can keep it relatively small, so 200 is a reasonable value.

The fourth input specifies the value for the property being affected (in this case, Brightness) at the outermost edge of the affected range (of 200px):

For this example, setting it to 0 will make the shapes completely dark when they are outside the range of the candle.

The fifth input specifies the value for the property being affected at the center of the affected range (when the candle is right on top of the element being affected):

For this example, setting it to 1 will bring the shapes to full brightness when the candle is directly on top of them.

The last input specifies the exponent to apply to the normalized distance function between the affector and the other elements:

For example, if this is set to 1, then the change in the brightness of elements will follow a linear progression as distance changes. Setting it to 2 will make it a quadratic, and 3 will make it cubic. For this example, any value between 1 or 2 should be fine.

Advanced Topics

If you want the point from which the distance is calculated to be somewhere other than the center of the element, you can adjust the Property Affector X and Property Affector Y settings under the Advanced category:

For example, in the candle example, you could set the Property Affector Y to 0 to make the distance point at the very top of the candle (at the flame). If you set it to 1, it would be at the very bottom of the candle.

In some cases, you'll only want the property affector to affect specific elements in the Room. To make that happen, you can set the Property Affector Tag Filter setting to a specific tag and only elements tagged with that value will be affected: