项目中有很多,这种长方形图片,想要改成拱形的。有哪些思路。
用三角函数的来调整一下y轴的高度
之前我用三角函数将一个直线的闪电拉成圆形过,所以拱形应该也可以
最简单的办法是用shader,在顶点里处理一下
多少钱?可以有偿解决 

试着写了个 shader, 显示不出来
CCEffect %{
techniques:
- name: “sin_effect”
passes:
- vert: vs:vert
frag: fs:frag
blendState:
targets:
- blend: true
blendSrc: src_alpha
blendDst: one_minus_src_alpha
depthStencilState:
depthTest: false
depthWrite: false
}%
CCProgram vs %{
precision highp float;
#include
in vec3 a_position;
in vec2 a_texCoord;
in vec2 a_color;
out vec2 uv;
vec4 vert(){
uv = a_texCoord;
vec4 pos = vec4(a_position, 1.0);
pos = cc_matViewProj * pos;
return pos;
}
}%
CCProgram fs %{
precision highp float;
#include
in vec2 uv;
vec4 frag(){
// 对 uv.y 做正弦扰动
float offset = sin(uv.x * 3.0 ) * 0.5;
vec2 wavedUV = vec2(uv.x, uv.y + offset);
vec4 color = texture(cc_spriteTexture, wavedUV);
return color;
}
}%
a_position 是图片的四个顶点。 原理应该是,所有的像素点的y值,按一个曲线 偏移。不知道怎样写,,
大佬牛,能贴下关键代码嘛~
哈哈,主要是想学习下shader,项目是自己下载的开源项目
是用的 shader 嘛?我还有个想法: 把图片分成N份,然后曲线排列。 同样,,也不知道该怎么写,哈哈
现实点,这种需求 直接美术去改.这种东西就像是,美术出的图千奇百怪,我们程序是能调.但决不能调,如果说公司非让你来干,直接换一家.不是说你能干就干的问题.做项目就要有章程,有规范.
拆成 bmfont,把每个字母用函数拼成弧形,这样不止弧形,各种形状都可以
是显示不到原图片大小外层来的,看下有没有大佬知道怎么做。
用assembler添加顶点,根据圆心位置重新计算每个顶点位置
干脆自定义顶点数据,自己算坐标就好了。
- 方案1.可以图片顶部补足够空白。
- 方案2.
关键代码
vec4 vert () {
...
pos.y = pos.y * scale;
uv0 = a_texCoord;
uv0.y = uv0.y * scale - scale * 0.5;
...
}
vec4 frag () {
...
float offsetY = sin(uv0.x * 3.1415) * scale * 0.5;
vec2 uvNew = vec2(uv0.x, (uv0.y + offsetY));
...
}
顶点着色器中pos.y = pos.y * scale; 让图片显示范围突破原本高度。 目前这样做会带来问题,有很大的偏移,根据图片y不同有不同的偏移…
效果图:
EffTest1.zip (42.5 KB)
对啊
这种东西美术出图就行了
如果是想学习shader,那当我没说

