En 3D, qué tapa a qué lo decide la distancia a la cámara y lo resuelve el búfer de profundidad. En 2D no hay tal cosa: lo que se dibuja después tapa a lo anterior, y ya está. Así que la pregunta «¿qué va delante?» es la pregunta «¿en qué orden se dibuja?».
Eso es zIndex. Cada sprite lleva el suyo, el renderizador ordena por él antes de dibujar, y
el número más alto queda encima. Aquí los tres cuadrados no se mueven ni cambian de
transparencia en ningún momento: lo único que cambia cada segundo es cuál de ellos tiene el
zIndex alto.
Vale la pena fijarse en que zIndex se escribe directamente sobre el sprite que devolvió
createSprite, dentro del useUpdate. No hay que avisar a nadie ni volver a crear el sprite:
el renderizador lee el valor tal y como esté cuando le toque dibujar el fotograma.
La transparencia es cosa aparte y por eso está aquí. Va en el color: cada cuadrado tiene un
a fijo y distinto en su tint, así que se ve a través de ellos y el cambio de orden se nota
sin necesidad de moverlos. Un sprite transparente sigue obedeciendo al zIndex como cualquier
otro.
Y cada uno es de un color distinto, a propósito: capas transparentes de un mismo color dan el mismo resultado en cualquier orden, porque mezclar blanco sobre blanco es blanco sobre blanco. Con tres blancos, el orden cambiaría cada segundo y no se vería.