How to use viewOrigin and scrollPos to fix Effects?

Post reply
0 favourites
  • 7 posts
From the Asset Store
Wind effect
$2.49 USD
Animated wind effect for objects, grass, trees, etc.
Mikal's avatar
Mikal

  • I need to fix the hexagonal pixellate effect- when the screen scroll, the effect doesn't take this into account so the effect goes crazy when the screen scrolls.

    I need help figuring out how to apply either the viewOrigin or the scrollPos to compensate for the scrolling.

    I imagine I'd have to add something like mod(scrollPos,scale) to some value, but it isn't clear to me where exactly, or which value, etc..

  • I thought it might be easier to edit the Pixellate effect instead of the Hexagonal, but I still can't seem to figure it out.

    /////////////////////////////////////////////////////////
// Pixellate effect
varying mediump vec2 vTex;
uniform lowp sampler2D samplerFront;

uniform mediump float pixelWidth;
uniform mediump float pixelHeight;

uniform mediump float tilesize;
uniform mediump vec2 scrollPos;

void main(void)
{
	mediump vec2 tilecount = vec2((1.0 / pixelWidth) / tilesize, (1.0 / pixelHeight) / tilesize);
	mediump vec2 tile = vec2(1.0 / tilecount.x, 1.0 / tilecount.y);
	mediump vec2 halftile = tile / 2.0;
	
	mediump vec2 offset = mod(scrollPos,tilesize);
	offset.x = pixelWidth*offset.x;
	offset.y = pixelHeight*offset.y;
	
	mediump vec2 tex = floor((vTex-offset) / tile) * tile + halftile;
	
	gl_FragColor = texture2D(samplerFront, tex);
}
[/code:qvcf99fi]

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads

  • Prominent

    Can you send .capx with the problem .. then i can look what's wrong .

  • Gigatron , https://1drv.ms/u/s!AhHSZHEulqh_gXNbRY9jc_ihjpvv

    There's an example of the issue.

  • Prominent

    Please try this code , it must working in this case ...

    Good luck ;

    /////////////////////////////////////////////////////////
// Pixellate effect
#ifdef GL_ES
precision mediump float;
#endif
 
varying mediump vec2 vTex;
uniform mediump sampler2D samplerFront;
uniform mediump float pixelWidth;
uniform mediump float pixelHeight;
 
vec2 iResolution = vec2( 1./pixelWidth, 1./pixelHeight);

#define PIXEL_SIZE 32.0

void main()  {
	vec2 uv = vTex;
    
    float plx = pixelWidth * PIXEL_SIZE  ;
    float ply = pixelHeight * PIXEL_SIZE  ;
    
    float xx = plx * (PIXEL_SIZE / iResolution.x);
    float yy = ply * (PIXEL_SIZE/ iResolution.y);
    
    uv.x = xx * floor(uv.x / xx);
    uv.y = yy * floor(uv.y / yy);
    
    gl_FragColor = texture2D(samplerFront, uv);
}[/code:803mkk8a]

*****
If it's work for you then you can replace : 
#define PIXEL_SIZE 32.0    with :    uniform float PIXEL_SIZE    to acces this variable from .xml file and C2 editor

  • Gigatron , that doesn't fix the issue. It still gets messed up when scrolling. The pixelated effect needs to pan with the scroll position.

  • Prominent

    Yes i understand ... i must move texture inside quad(Vtex) to do what you want.. added for my todo list...

Post reply
  • 7 posts
Return to board index
Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)