Step 2 - ADAS¶
In this step, you create the ADAS functionality.
Create ADAS view with cross-fade transition¶
To create the ADAS view with cross-fade transition:
In the Node Tree, in the Cluster Components, delete the ADAS with more vars node.
In this procedure, you create the replacement content.
In the Cluster Components node, create an Empty Node 2D, and name it ADAS_View. In the Properties, add and set:
Layout Width to 946
Layout Height to 480
Render Transformation property fields
Translate X to 487
Translate Y to 202
You use the values for the layout size and transformation from the Figma design.
In the Library, create a State Manager and name it ADAS State Manager:
Select the State Group and in the Properties:
Set the Controller Property to isActive
Under the State Transitions property, click Add transition and set:
Duration to 300 ms
Easing Function to Cubic
Easing Mode to Ease in-out
Rename the states to Active and Inactive, and in each add and set:
Active state:
isActive to enabled
Node > Opacity to 1
Inactive state:
isActive to disabled
Node > Opacity to 0
From the Prefabs, drag the ADAS with more vars prefabs to the ADAS View.
In the Properties, for each ADAS with more vars prefab instance add and set:
Resources > State Manager to ADAS State Manager
04 Center Control > ADAS_Control to its ADAS view:
Default prefab instance to ADAS_01
Step 01 prefab instance to ADAS_02
Step 02 prefab instance to ADAS_03
Step 03 prefab instance to ADAS_04
For each ADAS with more vars prefab instance, in the Properties click Add Binding, and bind:
Visible property to
CEIL({@./Node.Opacity})When Opacity is 0, this binding sets the Visible property to false. This way the node is not rendered when not active.
isActive property to
{@./Control.ADAS_Control} == {@../Control.ADAS_Control}
In the ADAS_View node, create a binding to control the ADAS views from the Control node. Bind the ADAS Control property to the same property in the Control node.
{#Control/Control.ADAS_Control}
After you restart the Preview, you can set the ADAS view in the Control node using the ADAS Control property.
Control collision warning¶
The ADAS view 02 (ADAS_02) contains a collision warning message. In this section, you adjust the project to control the visibility of the collision warning message with a property.
To control the collision warning:
In the Library, create a State Manager and name it Collision Warning State Manager:
Select the State Group and in the Properties:
Set the Controller Property to Collision Warning
Under the State Transitions property, click Add transition and set:
Duration to 300 ms
Easing Function to Cubic
Easing Mode to Ease in-out
Rename the states to Active and Inactive, and in each add and set:
Active state:
CollisionWarning to enabled
Node > Opacity to 1
Transform 2D > Render Transformation property field Translation Y to 0
Inactive state:
CollisionWarning to disabled
Node > Opacity to 0
Transform 2D > Render Transformation property field Translation Y to 100
In the Node Tree, select the Cluster Components > ADAS_View > ADAS with more vars | Property 1=ACC Step 01_2386:1077 > Property 1=ACC Step 01 > CollisionWarning node.
In the Properties:
Click Add Binding and bind:
Visible property to
CEIL({@./Node.Opacity})When Opacity is 0, this binding sets the Visible property to false. This way the node is not rendered when not active.
isActive property to
{#Control/Control.ADAS_CollisionWarning}
Set the State Manager property to Collision Warning State Manager.
You can now control the collision warning in the Control node. The collision warning is shown when:
ADAS Control is set to ADAS_02
Collision Warning is set to enabled
