Coder Social home page Coder Social logo

Comments (3)

gsioteam avatar gsioteam commented on July 29, 2024 1

Added leftToRight option a6e88cc

from flip_widget.

gsioteam avatar gsioteam commented on July 29, 2024

It is easy, in the gl_render.dart you can find the fragment shader

precision mediump float;
uniform sampler2D texture;
uniform float percent;
uniform float tilt;
uniform vec2 size;
varying vec2 uv;

float px(float uvx) {
    return uvx * size.x;
}

float py(float uvy) {
    return uvy * size.y;
}

vec2 to_uv(vec2 pos) {
    // Modified from vec2(pos.x / size.x, 1.0 - pos.y / size.y)
    return vec2(1.0 - pos.x / size.x, 1.0 - pos.y / size.y);
}

void main()
{
    const float roll_size = 6.0;
    // Modified from float x1 = px(uv.x)
    float x1 = px(1.0 - uv.x);
    float y1 = py(1.0 - uv.y);
    float per = px(percent);
    if (y1 / tilt + per < x1) {
        gl_FragColor = vec4(0.0, 0.0, 0.0, 0.0);
    } else {
        float x0 = (x1 / tilt + y1 + per * tilt) / (tilt + 1.0/tilt);
        float off = x1 - x0;
        float dis = abs(off);
        float x2 = 2.0 * x0 - x1;
        float y2 = 2.0 * (x1 - x0) / tilt + y1;
        if (off > -roll_size && off <= 0.0) {
            y1 = y1 - (-sqrt(-off * off - 2.0 * roll_size * off) + roll_size);
        }
        if (y1 > 0.0) {
            off = x2 - x0;
            if (off > 0.0) {
                if (off < roll_size) {
                    y2 = y2 - (sqrt(-off * off + 2.0 * roll_size * off) + roll_size);
                } else {
                    y2 = y2 - 2.0 * roll_size;
                }
            }
            if (y2 > 0.0 && y2 < size.y && x2 < size.x) {
                vec4 shadow = mix(vec4(0.6, 0.6, 0.6, 1.0), vec4(0.98, 0.98, 0.98, 1.0), min(1.0, dis/20.0));
                gl_FragColor = texture2D(texture, to_uv(vec2(x2, y2))) * shadow;
            } else {
                vec4 shadow = mix(vec4(1.2, 1.2, 1.2, 1.0), vec4(1.0, 1.0, 1.0, 1.0), min(1.0, dis/20.0));
                float sha_off = pow(max(0.0, max(y2 - size.y, -y2)), 2.0) + pow(max(0.0, x2 - size.x), 2.0);
                shadow = shadow - (1.0 - smoothstep(0.0, 81.0, sha_off)) * vec4(0.3, 0.3, 0.3, 0.0);
                gl_FragColor = texture2D(texture, to_uv(vec2(x1, y1))) * shadow;
            }
        } else {
            gl_FragColor = vec4(0.0, 0.0, 0.0, 0.0);
        }
    }
}

I will add an option to implement this functionality.

from flip_widget.

M144-Coder avatar M144-Coder commented on July 29, 2024

Thanks for the solution, I confirm it's working. But I think it will be better to pass the left to right parameter to the startFlip and/or flip function instead of the FlipWidget itself.

from flip_widget.

Related Issues (8)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.