# Layout Containers

**Modular and spatial configurator** physical constraints can now be setup easily in platform using new **Layout Container** nodes to build Room Builder like interactions in the Threekit Player:

* Item Selection and highlighting
* Item positioning/dragging
* Positioning constraints

![](https://2668731230-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fknvt0jlDBXmk91mWaWXB%2Fuploads%2FwYBBOlJEHIwCC9zu8xsM%2FLayoutContainer_1.gif?alt=media\&token=3f4f0944-56b7-4fb6-ad7f-be5e466e8b74)

Layout Container nodes control for movement constraints, selectability of elements, and outline styling.

**Layout Container Node**

Layout Container nodes can be added in the scene using the new toolbar icon or the right-click menu in the Scene Tree:

![](https://2668731230-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fknvt0jlDBXmk91mWaWXB%2Fuploads%2Fz0RK7Cl2NIhgEuR41UaA%2FLayoutContainer_2.png?alt=media\&token=ef85d44f-1c68-4c99-b8b4-1aebfc493d8f)

![](https://2668731230-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fknvt0jlDBXmk91mWaWXB%2Fuploads%2FOMgUWJvGNXTkv3EnrIE2%2FLayoutContainer_3.png?alt=media\&token=03f58d54-812c-477c-96f7-e2541c1895e3)

To enable dragging, use the **Container Meshes reference** field to reference existing node(s) within he asset to act as dragging constraints. In this example, there is a Plane node representing a floor so that elements cannot be moved beyond it:

![](https://2668731230-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fknvt0jlDBXmk91mWaWXB%2Fuploads%2FtvP2yjsTdkrgzWe6uUmA%2FLayoutContainer_4.png?alt=media\&token=53ab603d-5fd4-47bc-beca-a355ce6007ed)

**Selection color & thickness**

Layout Containers contain overrides for the default Selection Highlight Color and Outline Thickness as Operators in the Selection section:

![](https://2668731230-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fknvt0jlDBXmk91mWaWXB%2Fuploads%2F0OCBU8Lor4d5reK72oTu%2FLayoutContainer_5.png?alt=media\&token=1f7a5fc1-08b7-44c0-bba8-1d73cd5c4664)

![](https://2668731230-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fknvt0jlDBXmk91mWaWXB%2Fuploads%2FxeHPfc0yeoKz7s9duO0G%2FLayoutContainer_6.png?alt=media\&token=7f49e6c2-dce6-48e7-9ebb-be15036f5d69)

Then, models can be imported into the asset and made children of the Layout Container in order to be constrained to the Floor Plane:

![](https://2668731230-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fknvt0jlDBXmk91mWaWXB%2Fuploads%2FcWshQsoU570lDkgr7LoF%2FLayoutContainer_7.png?alt=media\&token=535f8a66-b114-426b-ab47-c091ab9b07c8)

In the example above, there are multiple Layout Container nodes to produce Floor and Wall constraints.&#x20;

**Props & immovable objects**

Props, or unselectable/immovable, elements can be added to the asset simply by placing the outside of layout containers.&#x20;

#### Selectable components

Want to make components of a product selectable in the Player? Layout Container nodes can also be used to make children nodes selectable without any movement. Simply leave the **Container Meshes** reference blank and all children will still be selectable in the player.
