effect文件在场景编辑器中效果和浏览器预览效果不一致

Creator 2.x
#1

effect文件在场景编辑器中效果和浏览器预览效果不一致

  • Creator 版本：2.3.2

  • 目标平台：Web

  • 详细报错信息，包含调用堆栈：

  • 重现方式：test232.zip (555.2 KB)

  • 之前哪个版本是正常的 ：

  • 手机型号 ：

  • 手机浏览器 ：

  • 编辑器操作系统 ：

  • 编辑器之前是否有其它报错 ：

  • 出现概率：100%

  • 额外线索：

#2

由于之前搞了一个拼图游戏，用的mask组件，最高难度是10*10，drawcall四百多且锯齿严重，所以打算用shader实现一下图片遮罩，然后就遇到问题了，场景编辑器中效果是期望的效果，但是预览就不对了

#3

还有就是有没有办法拿到图集中一个spriteframe的剪切后的纹理，spriteFrame.getTexture()拿到的是整个图集的纹理

#4

这是在场景编辑器中

这是浏览器预览效果

#5

片元着色器代码
CCProgram fs %{
precision highp float;

#include
#include

in vec4 v_color;

#if USE_TEXTURE
in vec2 v_uv0;
uniform sampler2D texture;
#endif

uniform sampler2D maskTexture;

uniform PROPERTIES{
float row;
float col;
float index;
float peiceWidth;
float peiceHeight;
float imgWidth;
float imgHeight;
};

vec4 getColor(){
float curRow = floor(index / col);
float curCol = mod(index,col);

float posX = (1.0/col) * curCol + (v_uv0.x*peiceWidth)/imgWidth;
float posY = (1.0/row) * curRow + (v_uv0.y*peiceHeight)/imgHeight;

vec2 rsPos = vec2(posX,posY);

return texture2D(maskTexture,rsPos);

}

void main () {
vec4 maskColor = texture2D(texture,v_uv0);

float deg = 0.001;
if(maskColor.a > 0.1){
  float p1_a = texture2D(texture,vec2(v_uv0.x-deg,v_uv0.y+deg)).a;
  float p2_a = texture2D(texture,vec2(v_uv0.x,v_uv0.y+deg)).a;
  float p3_a = texture2D(texture,vec2(v_uv0.x+deg,v_uv0.y+deg)).a;
  float p4_a = texture2D(texture,vec2(v_uv0.x+deg,v_uv0.y)).a;
  float p5_a = texture2D(texture,vec2(v_uv0.x+deg,v_uv0.y-deg)).a;
  float p6_a = texture2D(texture,vec2(v_uv0.x,v_uv0.y-deg)).a;
  float p7_a = texture2D(texture,vec2(v_uv0.x-deg,v_uv0.y-deg)).a;
  float p8_a = texture2D(texture,vec2(v_uv0.x-deg,v_uv0.y)).a;

  gl_FragColor = vec4(getColor().rgb,(p1_a+p2_a+p3_a+p4_a+p5_a+p6_a+p7_a+p8_a)/8.0);
}else{
  discard;
}

}
}%

1赞
#6

沉了沉了:3:

#7

选中图片，去掉 packable 选项试试。

1赞
#9

嗯，可以了，谢谢大佬:2: