![](/img/trans.png)
[英]Why GLSL line has flaws inside when drawing with a pure GLSL fragment shader
[英]Drawing a perfect horizontal line at a specific position with a fragment shader
将片段着色器应用于屏幕对齐的四边形,是否可以在垂直轴上的任何选定位置绘制单个像素高度的完美水平线?
我找到了许多具有平滑步骤或更复杂功能的解决方案,但我正在寻找一种优雅,快速的方法。
我提出的解决方案是使用指数函数并将其变得更陡峭,但是它有许多我不希望出现的缺点(由于指数函数,该线并不是真正的一个像素高度,并且很难正确设置) ,这是GLSL代码:
void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
vec2 uv = fragCoord.xy / iResolution.xy;
// a centered horizontal line
float v = pow(uv.y - 0.5, 2.);
// make it steeper
v *= 100000.;
// make it white on a black background
v = clamp(1. - v, 0., 1.);
fragColor = vec4(v);
}
这是执行此操作的shadertoy代码: https ://www.shadertoy.com/view/Ms2cWh
我想要什么:
如果您只想:
将片段着色器应用于屏幕对齐的四边形,在垂直轴上的任何选定位置绘制单个像素高度的完美水平线
,那么也许:
void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
int iPosition = 250; // the y coord in pixels
int iThickness = 10; // the thickness in pixels
vec2 uv = fragCoord.xy / iResolution.xy;
float v = float( iPosition ) / iResolution.y;
float vHalfHeight = ( float( iThickness ) / ( iResolution.y ) ) / 2.;
if ( uv.y > v - vHalfHeight && uv.y < v + vHalfHeight )
fragColor = vec4(1.,1.,1.,1.); // or whatever color
}
这是一个无需分支的简洁解决方案。 我不知道它是否真的比分支更快。
void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
vec2 uv = fragCoord.xy / iResolution.xy;
float py = iMouse.y/iResolution.y;
float hh = 1./iResolution.y;
// can also be replace with step(0., hh-abs(uv.y-py))
float v = sign(hh-abs(uv.y-py));
fragColor = vec4(v);
}
我知道问题已经在我面前得到了正确回答,但是如果有人正在寻找一种以像素完美方式渲染纹理线条的方法,我会写一些示例的文章 。
通常,它是关于像素完美的UI的,但是将其用于一行仅是夹紧/重复纹理采样的问题。 另外,我正在使用Unity,但是没有理由该方法不排斥它。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.