koobas.hobune.stream
The question is answered, right answer was accepted
How to create a "back" side of a canvas UI element
I'm using the new 4.6 UI, and trying to create canvas UI elements that can be "flipped" to show a back side. I'm using the Canvas Render Mode "Screen Space - Camera" with a perspective camera.
Unfortunately, if I simply rotate an existing element 180 degrees, I just see an upside-down, mirrored rendering of the front side. The rendering order of the child elements is not reversed, so a child element at the "back" is still obscured by elements at the "front" (even though the entire parent has been flipped).
Is there any way to create this front/back effect using the Canvas UI?
Yes. $$anonymous$$y answer below satisfies the OP's request. That's why it's marked as the correct answer.
You must want to see the flipping occur via animation, right? Otherwise you'd just swap the contents of your group-o-elements.
Well, at the exact moment all the elements are facing the camera edge-on, for all intents and purposes, the elements become invisible. During that frame, swap the contents of your group to an identically-sized "B-side" alternate version.
I'm currently investigating this myself. In my case, I am implementing a "card" that can be flipped over, and then back. So the backside should have another surface. I will use an Image or Button for this. For now this seems to do the trick, but I don't know if it will work well down the line:
In the flip animation, add a keyframe at rotation of 90 degrees. There you can add another image. Also, set scale to -1 depending on what axis you rotate the image. I flip the card over on the Y axis, so I needed to invert the scale of the X axis to get the backside of the card to not be mirrored to the viewer.
Solved this by adding a standart material (unity 5) to a material slot of the component of GUI button. At the top of the standart material settings in pulldown menu choose FADE mode. Supports .png with opacity. Back side of the element bacome invisile.
