Donate to e Foundation | Murena handsets with /e/OS | Own a part of Murena! Learn more

Commit 160d9070 authored by Yein Jo's avatar Yein Jo
Browse files

Expose blur, Draw a ring outside of the given size in RippleShader.

Design doc can be found in the bug attached.

This is part of polishing the tablet docking animation. Note that
the below CLs will be submitted together under the same topic:
* [this CL] Expose blur, draw a ring outside (to match the logic with
  the other shapes)
* Add TargetSize (name subject to change)
* Update parameter values in WirelessChargingLayout

Bug: 269124200
Test: RippleViewText, Manual
Change-Id: Idf5c7838491149b8f240c91413db2dc7ce166479
parent d82af723
Loading
Loading
Loading
Loading
+13 −2
Original line number Diff line number Diff line
@@ -99,7 +99,7 @@ class RippleShader(rippleShape: RippleShape = RippleShape.CIRCLE) :
            vec4 main(vec2 p) {
                float sparkleRing = soften(roundedBoxRing(p-in_center, in_size, in_cornerRadius,
                    in_thickness), in_blur);
                float inside = soften(sdRoundedBox(p-in_center, in_size * 1.2, in_cornerRadius),
                float inside = soften(sdRoundedBox(p-in_center, in_size * 1.25, in_cornerRadius),
                    in_blur);
                float sparkle = sparkles(p - mod(p, in_pixelDensity * 0.8), in_time * 0.00175)
                    * (1.-sparkleRing) * in_fadeSparkle;
@@ -191,6 +191,15 @@ class RippleShader(rippleShape: RippleShape = RippleShape.CIRCLE) :
        maxSize.y = height
    }

    /**
     * Blur multipliers for the ripple.
     *
     * <p>It interpolates from [blurStart] to [blurEnd] based on the [progress]. Increase number to
     * add more blur.
     */
    var blurStart: Float = 1.25f
    var blurEnd: Float = 0.5f

    /**
     * Linear progress of the ripple. Float value between [0, 1].
     *
@@ -209,6 +218,8 @@ class RippleShader(rippleShape: RippleShape = RippleShape.CIRCLE) :
    /** Progress with Standard easing curve applied. */
    private var progress: Float = 0.0f
        set(value) {
            field = value

            currentWidth = maxSize.x * value
            currentHeight = maxSize.y * value
            setFloatUniform("in_size", currentWidth, currentHeight)
@@ -217,7 +228,7 @@ class RippleShader(rippleShape: RippleShape = RippleShape.CIRCLE) :
            // radius should not exceed width and height values.
            setFloatUniform("in_cornerRadius", Math.min(maxSize.x, maxSize.y) * value)

            setFloatUniform("in_blur", MathUtils.lerp(1.25f, 0.5f, value))
            setFloatUniform("in_blur", MathUtils.lerp(blurStart, blurEnd, value))
        }

    /** Play time since the start of the effect. */
+10 −0
Original line number Diff line number Diff line
@@ -84,6 +84,16 @@ open class RippleView(context: Context?, attrs: AttributeSet?) : View(context, a
        ripplePaint.shader = rippleShader
    }

    /**
     * Sets blur multiplier at start and end of the progress.
     *
     * <p>It interpolates between [start] and [end]. No need to set it if using default blur.
     */
    fun setBlur(start: Float, end: Float) {
        rippleShader.blurStart = start
        rippleShader.blurEnd = end
    }

    @JvmOverloads
    fun startRipple(onAnimationEnd: Runnable? = null) {
        if (animator.isRunning) {
+9 −6
Original line number Diff line number Diff line
@@ -50,9 +50,9 @@ class SdfShaderLibrary {

            float roundedBoxRing(vec2 p, vec2 size, float cornerRadius,
                float borderThickness) {
                float outerRoundBox = sdRoundedBox(p, size, cornerRadius);
                float innerRoundBox = sdRoundedBox(p, size - vec2(borderThickness),
                    cornerRadius - borderThickness);
                float outerRoundBox = sdRoundedBox(p, size + vec2(borderThickness),
                    cornerRadius + borderThickness);
                float innerRoundBox = sdRoundedBox(p, size, cornerRadius);
                return subtract(outerRoundBox, innerRoundBox);
            }
        """
@@ -69,10 +69,13 @@ class SdfShaderLibrary {

            vec2 u = wh*p, v = wh*wh;

            float U1 = u.y/2.0;  float U5 = 4.0*U1;
            float U2 = v.y-v.x;  float U6 = 6.0*U1;
            float U3 = u.x-U2;   float U7 = 3.0*U3;
            float U1 = u.y/2.0;
            float U2 = v.y-v.x;
            float U3 = u.x-U2;
            float U4 = u.x+U2;
            float U5 = 4.0*U1;
            float U6 = 6.0*U1;
            float U7 = 3.0*U3;

            float t = 0.5;
            for (int i = 0; i < 3; i ++) {