像素精灵元素GLSL - 09-绘制一个月亮(the moon)

493 阅读1分钟

绘制一个满月

示例代码
#ifdef GL_ES
precision mediump float;
#endif

uniform float u_time;
uniform vec2 u_resolution;
uniform vec2 u_mouse;

/**
* @param x 坐标点
* @param size 大小 
*/
float fill(float x, float size){
    return 1.0 - step(size,x);
}

/**
* @param st 坐标点
*/
float circleSDF(vec2 st){
    return length(st-0.5) * 2.0;
}

void main(){
    vec2 st = gl_FragCoord.xy / u_resolution;
    st.x *= u_resolution.x/u_resolution.y;
    vec3 color = vec3(0.0); 

    color +=fill(circleSDF(st), 0.65);
    gl_FragColor = vec4(color, 1.0);
}
代码效果

绘制一个半月

示例代码
#ifdef GL_ES
precision mediump float;
#endif

uniform float u_time;
uniform vec2 u_resolution;
uniform vec2 u_mouse;

/**
* @param x 坐标点
* @param size 大小 
*/
float fill(float x, float size){
    return 1.0 - step(size,x);
}

/**
* @param st 坐标点
*/
float circleSDF(vec2 st){
    return length(st-0.5) * 2.0;
}

void main(){
    vec2 st = gl_FragCoord.xy / u_resolution;
    st.x *= u_resolution.x/u_resolution.y;
    vec3 color = vec3(0.0); 

    color +=fill(circleSDF(st), 0.65);
    vec2 offset = vec2(0.1, 0.05);
    color -=fill(circleSDF(st-offset), 0.5);

    gl_FragColor = vec4(color, 1.0);
}
代码效果

《像素精灵元素GLSL》期待你的关注与点赞