[筆記][Cocoscreator]2D Sprite/Label在3D模型上渲染(2.4.3)

如果要達成上圖效果，在3.0.0版本後就有cc.RenderRoot2D可以使用，直接在Label上或是Sprite上Add Component就好。詳細可以見官網！
但是3版以前的並沒有這麼支援3D的功能！
在我一番搜尋+瞎貓碰到死耗子的狀況，終於搞定了這個功能。
下收做法：
簡單來說就是讓shader加入深度渲染判斷！

複製defult-spirte.effect，修改裡面的code：(加入紅色部分)

CCEffect %{
  techniques:
  - passes:
    - vert: vs
      frag: fs
      blendState:
        targets:
        - blend: true
      depthStencilState:
        depthTest: true
        depthWrite: true
      rasterizerState:
        cullMode: back
      properties:
        texture: { value: white }
        alphaThreshold: { value: 0.5 }
        outlineSize: {value: 0.0}
        outlineColor: {value: [1,1,1,1]}
}%

接著建立一個Material，並且用VSCode或是Notepad++打開。
修改裡面的內容：(加入紅色部分)

{
  "__type__": "cc.Material",
  "_name": "",
  "_objFlags": 0,
  "_native": "",
  "_effectAsset": {
    "__uuid__": "60f7195c-ec2a-45eb-ba94-8955f60e81d0"
  },
  "_techIdx": 0,
  "_defines": [
    {
      "USE_TEXTURE": true
    }
  ],
  "_states": [
    {
      "rasterizerState": {},
      "depthStencilState": {
        "depthTest": true
      },
      "blendState": {
        "targets": [
          {}
        ]
      }
    }
  ],
  "_props": [
    {}
  ]
}

Material存檔後，記得要拉到Sprite或Label的Material內!!

這樣就可以達成2D圖片會隨著3D模型去做變化了!!

參考:
3D Label Depth Test
官方github: 2d-rendering-in-3d