Sharpen Shader Inquiry

Questions about the LÖVE API, installing LÖVE and other support related questions go here.
Forum rules
Before you make a thread asking for help, read this.
Post Reply
Garb
Prole
Posts: 29
Joined: Fri Aug 05, 2011 8:47 pm

Sharpen Shader Inquiry

Post by Garb »

I want to create a shader that sharpens everything on the screen; however I can't find a sharpen shader.

I did find this though,
https://www.shadertoy.com/view/lslGRr

Code: Select all

void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    vec2 uv = fragCoord.xy / iResolution.xy;
    
    uv.x = mod( uv.x * 2.0, 1.0 );
    
    uv = uv * (0.6 + 0.4 * sin(iGlobalTime * 0.5));
    
	vec2 step = 1.0 / iResolution.xy;
	
	vec3 texA = texture2D( iChannel0, uv + vec2(-step.x, -step.y) * 1.5 ).rgb;
	vec3 texB = texture2D( iChannel0, uv + vec2( step.x, -step.y) * 1.5 ).rgb;
	vec3 texC = texture2D( iChannel0, uv + vec2(-step.x,  step.y) * 1.5 ).rgb;
	vec3 texD = texture2D( iChannel0, uv + vec2( step.x,  step.y) * 1.5 ).rgb;
   
    vec3 around = 0.25 * (texA + texB + texC + texD);
	vec3 center  = texture2D( iChannel0, uv ).rgb;
	
	float sharpness = 1.0;
	
    if( fragCoord.x / iResolution.x < 0.5 )
        sharpness = 0.0;
    
	vec3 col = center + (center - around) * sharpness;
	
    fragColor = vec4(col,1.0);
}
(the code in question)

and I'm curious if it's possible to translate this into something that love could interpret, does anyone have any ideas? (or a sharpen shader already working with love would be cool too)

thanks
ghurk
Prole
Posts: 15
Joined: Tue Apr 25, 2017 11:05 pm

Re: Sharpen Shader Inquiry

Post by ghurk »

if u look properly at what this shader does, you can basically just use pretty ugly sharpen in photoshop. Final quality on zoom is meh. It looks "better" due to higher contrast, which can be achieved by manual pre-sharpening of graphic data used.
My tips:
1. Photoshop your source data right form start and you will probably achieve better results
2. Use higher source quality if possible
3. Find better shader as example. this shader just over-sharpens image without "increasing" quality, possibly useable if adjusted so that it turns on only when zoomed without breaking texture while not (while sharpen level = zoom-in level)
4. If you cant pre-filter data or use any data of higher quality, then it would be still better to use cpu filter instead gpu shader (again, if possible), which will sharpen the source only once on load and then keep data in memory or file for further use, depending on what kind of application are you working on.
5. In case you want to make your own photoshop-like app, then good luck.
User avatar
raidho36
Party member
Posts: 2063
Joined: Mon Jun 17, 2013 12:00 pm

Re: Sharpen Shader Inquiry

Post by raidho36 »

LOVE uses normal shaders. Do yes you can, in fact you hardly have to modify anything. There whole change set amounts to renaming some variable names and return new color from function rather than set it via reference. See the manual.
ghurk
Prole
Posts: 15
Joined: Tue Apr 25, 2017 11:05 pm

Re: Sharpen Shader Inquiry

Post by ghurk »

ok, played around a lil. based the shader on standard Love2d one, so should be working properly with color settings etc. Didnt try on meshes yet.

adjustable sharpness level, and also applies to alpha of texture. can send modification which wont touch alpha.
also id like if some1 could try it out in different cases and try to exploit any mistakes i made (if i did).

this is shader (for love 0.10.2):

Code: Select all

shaderCustom = love.graphics.newShader [[
//sent to shader through "shaderCustom.send( shaderCustom, "sharpness", sharpness )", adjust sharpness level ( 0.0 = none )
extern float sharpness;

vec4 effect( vec4 color, Image texture, vec2 texture_coords, vec2 screen_coords )
{
	//not sure how this line works, possibly needs to adjust. somehow works...
	vec2 step = 1.0 / screen_coords;
	
	//data of pixels around
	vec4 texA = Texel( texture, texture_coords+vec2(-step.x,-step.y)*1.5 );
	vec4 texB = Texel( texture, texture_coords+vec2( step.x,-step.y)*1.5 );
	vec4 texC = Texel( texture, texture_coords+vec2(-step.x,step.y)*1.5 );
	vec4 texD = Texel( texture, texture_coords+vec2( step.x,step.y)*1.5 );
   
	//average data of pixels around
	vec4 around = 0.25*(texA+texB+texC+texD);
	//normal pixel data
	vec4 center = Texel( texture, texture_coords );
    
	//normal pixel data + additional data*sharpness
	vec4 texturecolor = center + (center-around)*sharpness;
    
	return texturecolor * color;
}
]]
in draw event used like this:

Code: Select all

sharpness = 1.0

function love.draw()
	--set sharpness level
	shaderCustom.send( shaderCustom, "sharpness", sharpness )
	
	--draw like normally
	love.graphics.setShader( shaderCustom )
	love.graphics.draw( data, 50, 50, 0, 5, 5 )
	love.graphics.setShader()
end
tip for use: sharpen only when scaling up. Adjust sharpness level based on scale amount.
Post Reply

Who is online

Users browsing this forum: Ahrefs [Bot], Bing [Bot], Google [Bot] and 133 guests