Introduction
This is part 2 of the 5 series of lessons on adding interactivity to the SVOYA Apartment interior.
Access to materials, such as: models in the "FBX" format, baked textures, scripts and more, you can get by subscribing to Patreon.
PatreonView the Playcanvas project online.
View Playcanvas Project OnlineCreate a "configurator" folder in "scripts" of the "Assets" panel.
Add a brush image.
In order not to create identical buttons from scratch, we will simply duplicate the existing ones.
Make a duplicate of the “PlayPause” button, name the new button “ChangeColor”, name the picture “PaintImage”. Delete the "PauseImage" image.
For the "PaintImage" image, select "paint.png".
Place a “ChangeColor” button next to the cabinets object as shown in the image below.
The button is ready, it remains to add the color change script.
Add the “change-color.js” script to the “scripts/configurator” folder.
Script "change-color.js".
Apply the script to the desired object, in our case it is “Cabinet”. To do this, select an object, add “Component” “Script” and select “changeColor” from the dropdown list.
Note!
It is worth noting that the script will change the colors of the "Diffuse" in the material, so the "Lightmap" of the material should have a black and white texture of baked shadows.
Material settings “Cabinet_2048”.
In the “changeColor” script settings, specify the material for which the color will change in the “Material” parameter.
Be sure to specify the “Trigger Button” - this is the button that will activate the color change.
In the “Colors” parameter, specify a number, how many colors there will be.
Next, adjust the colors.
Ready! Run the project, you should change colors by pressing the "ChangeColor" button.
Conclusion
In this part of the tutorial, we made a simple material color change configurator.
Patreon subscribers will be able to view the SVOYA Apartment project in read mode, as well as quickly copy-paste the necessary assets and scripts into their personal project.
For everyone else, you will find everything you need on the page of this lesson.
Patreon