Box entity with 6 textures?

Hi,

Q1: Could you tell me please how I can define different textures for all the 6 surfaces of a box entity?
Q2: I can translate and scale texture. How I can rotate it without uploading another rotated texture?

I am interested in via GUI and via script as well.

Thank you in advance
Balint

Hi @balint and welcome,

The easiest way is to create a cube model in your favorite modelling program and group each face as a different material group. When importing the model in Playcanvas you will 6 unique mesh instances, where you can assign a different material for each face.

In code you can do something like this:

// targeting face No3
myCubeEntity.model.meshInstances[3].material = materialB;

I think for rotating a texture on a surface, unless you want to do this once on a model where you can change the UV coords in your modelling app, the only option is to use a custom shader.

The most straightforward way is to override a pixel shader chunk and rotate the UV coordinates of the projected texture. That can be advanced, but you can start your way working with shaders in Playcanvas with one of the following examples:

https://developer.playcanvas.com/en/tutorials/?tags=shaders

Thank you very much @Leonidas for your fast and detailed reply.

First I try to avoid importing model and I try to create built in geometry primitives via script to get high performance and keep my project automatically generated via functions.
My project can be built from boxes.

Is it possible to use built in geometry primitives such as box and define textures for each surfaces or apply cubemap as texture?
I can see there is a plan surface as well but creating a box from 6 surfaces makes my model more bigger.

If not possible maybe mesh can be generated via script.

Thank you

Yes, if you are feeling comfortable working with vertices directly you can leverage the Mesh API to create procedural models.

You can check the examples on the engine repo on how to use it:

https://playcanvas.github.io/#graphics/mesh-generation.html

1 Like

Thank you very much!