ShadowGun环形山及水面效果

这两个比较简单,水面效果是用普通的贴图shader即可,而环形山则用了discard,当透明度小了于一定阀值时,把当前像素丢弃。


先上效果图

环形山

加上水面效果

内部效果


环形山shader

CCEffect %{
  techniques:
  - name: opaque
    passes:
    - vert: unlit-vs:vert
      frag: unlit-fs:frag
      properties: &props
        color:        { value: [1, 1, 1, 1], inspector: { type: color } }
        tilingOffset: { value: [1, 1, 0, 0] }
        alphaTest:    { value: 0.1 }
        mainTexture:  { value: grey         }
  - name: transparent
    passes:
    - vert: unlit-vs:vert
      frag: unlit-fs:frag
      blendState:
        targets:
        - blend: true
          blendSrc: src_alpha
          blendDst: one_minus_src_alpha
          blendSrcAlpha: src_alpha
          blendDstAlpha: one_minus_src_alpha
      properties: *props
}%

CCProgram unlit-vs %{
  precision mediump float;
  #include <cc-global>
  #include <cc-local-batch>
  #include <input>

  #if USE_VERTEX_COLOR
    in vec4 a_color;
    out vec4 v_color;
  #endif

  #if USE_TEXTURE
    in vec2 a_texCoord;
    out vec2 v_uv;
    uniform TexCoords {
      vec4 tilingOffset;
    };
  #endif

  highp vec4 vert () {
    vec4 position;
    CCVertInput(position);

    highp mat4 matWorld;
    CCGetWorldMatrix(matWorld);


    highp vec4 pos = cc_matProj * (cc_matView * matWorld) * position;

    #if USE_TEXTURE
      v_uv = a_texCoord;
      #if FLIP_UV
        v_uv.y = 1.0 - v_uv.y;
      #endif
      v_uv = v_uv * tilingOffset.xy + tilingOffset.zw;
    #endif

    #if USE_VERTEX_COLOR
      v_color = a_color;
    #endif

    return pos;
  }
}%

CCProgram unlit-fs %{
  precision mediump float;
  #include <output>

  #if USE_TEXTURE
    in vec2 v_uv;
    uniform Constant1 {
      float alphaTest;
    };
    uniform sampler2D mainTexture;
  #endif

  #if USE_COLOR
    uniform Constant {
      vec4 color;
    };
  #endif

  #if USE_VERTEX_COLOR
    in vec4 v_color;
  #endif

  vec4 frag () {
    vec4 o = vec4(1, 1, 1, 1);

    #if USE_TEXTURE
      o *= texture(mainTexture, v_uv);
      if(o.a < alphaTest)
        discard;
    #endif


    #if USE_COLOR
      o *= color;
    #endif

    #if USE_VERTEX_COLOR
      o *= v_color;
    #endif

    return CCFragOutput(o);
  }
}%

环形山可以加上个加亮的参数,请自行参考 ShadowGun的天空盒shader,效果会更好看。。


shadowgun_hill&water.zip (539.2 KB)
资源,模型,素材,打包上传。


水面shader参数设置

环形山shader参数设置


使用办法:

  1. 在项目资源里创建一个Effect文件,然后把上面的的shader代码全放进去
  2. 再创建一个Material文件,然后选中Material文件,在右边属性栏处,Effect选择第1步创建的Effect
  3. 再把贴图拉进MainTexture里面。其它参数可以自行修改试试,会出现不同的效果。
  4. 最后再把这个材质拉到你的对象材质上。
5赞

这会舒服 了

mark

哥白尼的棺材板按不住了

可以商用么?

模型跟图片最好不要用,毕竟是别人项目出来的。
当然只是小范围玩玩还是可以的。
shader就无所谓了,随便用。

这个水怎么弄成半透明的,就是人在水中有用的时候,能看到人,但是人又不能和不在水里一样