This page features the creation of a [[ URL | Customizable Object ]] with two child assets (two pieces of cloth) enclosed by a **Group** node that allows choosing the way of enabling or disabling each one of them. Each child asset exemplifies a different way to create objects’ hierarchies: the first one is a child that uses the same parent’s material through nodes that permits the modification of some textures, and the second one, uses its own independent material. In both examples, the pieces of clothes are two different types of trousers.
(WARNING) We recommend visiting the [[ URL | Basic Concepts ]] page before start creating any Customizable Object
(NOTE) The resulting Customizable Object of this example can be found in the [[https://work.anticto.com/w/mutable/unreal-engine-4/examples/#village-demo | Village Demo ]] in //Content/Examples/HowTo// named "ClothPieces"
= Add a child object using its parent’s material
In this first example, the cloth piece proposed is a pair of officer trousers. This child object is sharing the same material as the parent’s through an **Extend Material** node which allows the modification of the parent material’s parameters by connecting its slots to new textures.
== Assets required
* One material asset or material instance of a character with two parameters (color and normal)
* One skeletal mesh of the character with the previous material applied (two parameters)
* One skeletal mesh of a pair of trousers (that fits the character) without any material applied (Piece 1)
* One color and one normal texture asset of the Piece 1
(NOTE) The assets used in this example can be found in the [[ https://work.anticto.com/w/mutable/unreal-engine-4/examples/#village-demo | Village Demo ]] in //Content/HowTo/ClothPieces//
1) The first step is to create a basic [[ https://work.anticto.com/w/mutable/unreal-engine-4/user-documentation/create-a-basic-customizable-object/ | Customizable Object]] asset with a **Base Object**, a **Material**, and a **Skeletal Mesh**.
> In this example, the Customizable Object asset is named "Cloth Pieces", the Reference Skeletal is "ClothPieces_BaseBody", the Material is called “ClothPieces_M” and the Skeletal Mesh is the same as the Reference Skeletal’s one.
2) From the** Base Object**'s "Children" connection, drag and drop to create a [[ https://work.anticto.com/w/mutable/unreal-engine-4/user-documentation/nodes/object-group/ | Group]] node. This node is created to enclose one or more child assets.
3) In the Group Name sub-tab of the Graph Node Properties tab, write a name for the node.
> In this case, the Group is named “Trousers”.
Choose the type of group preferred in the Group Type sub-tab.
> In this example, the type selected is “At least one Option”, which creates a drop-down menu of choices in which, at least, one option must be enabled.
4) In this step, the first Child Object (Piece 1) is created. Click and drag from the “Objects” connection of the **Group** node to create a [[ https://work.anticto.com/w/mutable/unreal-engine-4/user-documentation/nodes/child-object/ | Child Object ]] node.
5) At the Graph Node Properties tab, write a name in the Object Name sub-tab. Leave the other sub-tabs as default.
> In this example, the first **Child Object** node is named “Officer”.
6) As the objective of this example is to create a child object that shares the same material as the parent, the node [[ https://work.anticto.com/w/mutable/unreal-engine-4/user-documentation/nodes/extend-material/ | Extend Material ]] is the one needed. From the “Lod 0” connection of the** Child Object** node create an ** Extend Material** node.
7) With the **Extend Material** node selected, in the Graph Node Properties tab, set the parent’s material on the Parent sub-tab. Now, the parent’s material is applied to the **Child Object** as well, so the same slots should have appeared on this node.
8) Create a [[ https://work.anticto.com/w/mutable/unreal-engine-4/user-documentation/nodes/skeletal-mesh/ | Skeletal Mesh ] node. On this node, the trousers mesh asset has to be set up.
9) Select the trousers' mesh at the Skeletal Mesh sub-tab of the Graph Node Properties tab.
Link the “Unnamed Material Mesh” connection of the new **Skeletal Mesh** node to the “Add Mesh” one of the **Extend Material** node, at the Source Graph tab.
10) As this child object’s mesh has its own color and normal texture, both textures should be connected to the slots that the **Extend Material** node has inherited from its parent. Here, the base diffuse texture of the trousers should be connected. Add a **Texture** node and link its connection “Image” to the “Base Color” one of the **Extend Material** node.
11) With the **Texture** node selected, choose the piece of cloth's color texture in the Graph Node Properties tab.
> In this example, the texture used is “MeshBased_TrousersOfficier_D”.
12) Add a new **Texture** node from the “Normal” connection of the **Extend Material** node.
13) Select the trousers corresponding normal map texture in the Graph Node Properties tab.
> In this example, the texture used is “MeshBased_TrousersOfficier_N”.
14) The first child object (Piece 1) is already created. Check if the Source Graph looks similar to this:
15) Compile. In the Preview Instance Properties tab, a drop-down menu called “Trousers” should appear with only one choice, the first pair of trousers.
At the Preview Instance Viewport tab, the character should look similar to the image below.
= Add a child object using its own material
This second and last example is an evolution of the first one in which another child object is added, but, in this case, the material used is a different and independent one that includes its own color and normal texture.
== Assets required
* A different skeletal mesh of a pair of trousers (that fits de character) without any material applied (Piece 2)
* One material asset or material instance for Piece 2 without any parameters but that includes (color and normal at least)
1) In this step, the second child object (Piece 2) is to be created. This object is not using its parent’s material but its own one. From the **Group** node’s connection “Objects”, create a second **Child Object** node.
2) Select the new **Child Object** and name it on the Graph Node Properties.
> In this example, the second **Child Object** node is named “Pirate”.
3) From the “LOD 0” connection of the second **Child Object** node, create a **Material** node. This node is used to add a new material.
4) Select the new **Material** node and, at the Graph Node Properties tab, select the second pair of trousers corresponding material in the Material sub-tab. This material is the one prepared beforehand which already includes the textures of color and normal map for this second child object but without any parameter slot.
> In this example, the material used is “ClothPieces_TrousersPirate_M”.
5) Then, create a **Skeletal Mesh** node. In the Graph Node Properties tab, select the second trousers' mesh.
> In this example, the mesh used is “ClothPieces_TrousersPirate”.
Link the two purple “Mesh” connections of the **Skeletal Mesh** node and the **Material** one at the Source Graph tab.
6) Verify that the nodes’ connections at the Source Graph tab are similar to the image below.
7) Compile. Check that when unfolding the drop-down menu, two choices appear. Select each choice and verify that they are displayed on the character. The result should be like this: