Is it possible and how to use pixijs shaders with openfl?
For example this one:
https://pixijs.io/examples/#/mesh-and-shaders/uniforms.js
Small example where to dig would be very appreciated
Is it possible and how to use pixijs shaders with openfl?
For example this one:
https://pixijs.io/examples/#/mesh-and-shaders/uniforms.js
Small example where to dig would be very appreciated
I think you just have to change the name of some variables.
For example (Iām not 100% sure)
uSampler2
by bitmap
vUvs
by openfl_TextureCoordv
It would be great if Openfl had a wiki to help create shaders on OpenFL !
You need to try !
You can find some help in the DisplayObjectShader.hx.
The easiest way I found:
@:glVertexSource("#pragma header
void main(void) {
#pragma body
// here be your shader code
}")
@:glFragmentSource("#pragma header
void main(void) {
#pragma body
// here be your shader code
}")
To translate a shader you might need some knowledge of what is that shader supposed to do. Check the headers of DisplayObjectShader.hx (@:glVertexHeader and @:glFragmentHeader) to see how different variables are called in openfl (texture coords, the texture itself, the transformation matrix, etc).
Good luck
Cannot port to openfl
Can you please help with example, how to create DisplayObjectShader using like in this example?
https://shaderfrog.com/app/view/3830
class Main extends Start {
public function new () {
super (640,1000,true);
stage.color = 0x0ff000;
}
private var bitmap:Bitmap;
private var spr:Sprite;
override public function onInit():Void{
super.onInit();
spr = new Sprite();
bitmap = new Bitmap(Assets.getBitmapData("assets/test.png"));
spr.addChild(bitmap);
this.addChild(spr);
bitmap.x = -bitmap.width/2;
bitmap.y = -bitmap.height/2;
spr.x = stage.stageWidth/2;
spr.y = stage.stageHeight/2;
bitmap.shader = new TestShader();
}
override public function onFrame():Void
{
if(spr != null){
spr.rotation += 1;
cast(bitmap.shader,TestShader).update();
bitmap.invalidate();
}
}
}
/**
* Shader Test
*/
class TestShader extends DisplayObjectShader {
@:glFragmentSource("
#pragma header
uniform float time;
void main(void) {
#pragma body
gl_FragColor = texture2D(openfl_Texture, openfl_TextureCoordv + sin( (time + (openfl_TextureCoordv.x) * 14.) ) * 0.1 );
}
")
public function new(){
super();
this.time.value = [0];
}
public function update():Void
{
this.time.value[0] += 0.1;
}
}
This is a simple example: https://pixijs.io/examples/#/mesh-and-shaders/uniforms.js