Monday, February 20, 2017

How to make button (or another GUI element) grayed out after pressing?

How To Get UI Button To Stay In A Pressed State. 
How to make grey background behind window?

Pay attention! It is just a visual solution, not a real changes characteristics of UI object.

Highlighted button.
  1. At Canvas select UI object which you want add visual effects (make highlighted, grey etc.).
  2. Create UI element "Panel" (you can also use another element) behind your object.
  3. Set characteristics of this background object (size, color, transparency).
  4. At "On click" section of your Button inspector panel set to make active your background object.
Now, when you click your Button, it will set active the Panel behind your Button. It will make your Button visible "highlighted" or another effect depends of color characteristics.

It is another example below. 
Behind "Authentication failed" window I made grey panel with 50% transparency. When this window pop-up, it also make active my grey panel.

Main menu.
Main Menu is grayed out.

I am just learning English. Please write me if you will see any spelling error! I will correct them. Thank you for reading.

Monday, February 13, 2017

Particles ahead GUI

Create different camera layers to render things 

Create 3 camera's with the following hierarchy: 

  1. Set all camera's to "Clear flags = Depth only"
  2. And set the depth of the camera's in the inspector as follow:
     Main Camera: Depth = 0
    Gui Camera: Depth = 1
    Gui Particle Camera: Depth = 2
  3. Now you have to create a layer for the GuiParticles:
  4. And assign your particle effect to this layer.
  5. In you inventory canvas change the render mode to "Screen space - Camera" and drag your GuiCamera to the "Render Camera" field.
  6. Change the layer of your inventory canvas (recursively) to "UI"
  7. Now finally set the culling masks for each camera as follow:
    Main Camera: Everything BUT "UI" and "Particles"
    GuiCamera: Nothing BUT "UI"
    GuiParticleCamera: Nothing BUT "Particles"
  8. You now have 3 render layers with each their own camera. All stuff marked as layer "Particles" will now be rendered in front of the "UI" layer.