react-native-theme-reveal 0.0.0-stage → 0.1.0

package/android/src/main/java/expo/modules/themereveal/KeptBitmaps.kt

@@ -0,0 +1,102 @@
+package expo.modules.themereveal
+
+import android.content.ComponentCallbacks2
+
+// Window-size bitmaps kept for the next PixelCopy capture so it doesn't have to allocate one. Only bitmaps that no
+// overlay or held press-in capture shows live here: a capture takes one out, and it comes back when its overlay
+// goes away or its held capture is dropped. A bitmap PixelCopy can't copy into (a GPU snapshot) is freed when it
+// comes back. Main thread only. Generic over the bitmap type so JVM tests can run it.
+internal class KeptBitmaps<B : Any>(
+  private val capacity: Int,
+  private val widthOf: (B) -> Int,
+  private val heightOf: (B) -> Int,
+  private val isFreed: (B) -> Boolean,
+  private val reusable: (B) -> Boolean,
+  private val free: (B) -> Unit,
+) {
+  // Off until a warm-up asks for a kept bitmap. While off, every returned bitmap is freed.
+  var keep = false
+
+  private val kept = ArrayList<B>(capacity)
+
+  // App is hidden or the activity is gone, so keep nothing until the next capture.
+  private var hidden = false
+  private var width = 0
+  private var height = 0
+  private var screenWidthDp = 0
+  private var screenHeightDp = 0
+
+  val size: Int get() = kept.size
+
+  // Kept bitmap of this size, or null. Kept bitmaps of another size get freed, since the window changed size.
+  fun take(width: Int, height: Int): B? {
+    hidden = false
+    this.width = width
+    this.height = height
+    val index = kept.indexOfFirst { matches(it) }
+    if (index < 0) {
+      clear()
+      return null
+    }
+    return kept.removeAt(index)
+  }
+
+  // A bitmap whose overlay is gone. Kept if keep is on, it's reusable, it has the size last asked for and there's
+  // room.
+  fun give(bitmap: B) {
+    if (isFreed(bitmap)) return
+    if (keep && !hidden && kept.size < capacity && reusable(bitmap) && matches(bitmap) && kept.none { it === bitmap }) {
+      kept.add(bitmap)
+    } else {
+      free(bitmap)
+    }
+  }
+
+  // Whether a warm-up needs to allocate a bitmap of this size. Kept bitmaps of another size don't count: fill frees
+  // them.
+  fun hasRoom(width: Int, height: Int): Boolean =
+    keep && !hidden && kept.count { widthOf(it) == width && heightOf(it) == height } < capacity
+
+  // A warm-up's new bitmap. Returns whether it's kept; if not, it's freed.
+  fun fill(bitmap: B): Boolean {
+    if (!hasRoom(widthOf(bitmap), heightOf(bitmap))) {
+      free(bitmap)
+      return false
+    }
+    width = widthOf(bitmap)
+    height = heightOf(bitmap)
+    kept.filterNot { matches(it) }.forEach(free)
+    kept.retainAll { matches(it) }
+    kept.add(bitmap)
+    return true
+  }
+
+  fun onTrimMemory(level: Int) {
+    if (level >= ComponentCallbacks2.TRIM_MEMORY_UI_HIDDEN) hide()
+  }
+
+  // Frees the kept bitmaps, and the ones that come back until the next capture or show.
+  fun hide() {
+    hidden = true
+    clear()
+  }
+
+  // App is back in the foreground (a warm-up from a resumed activity), so keep bitmaps again.
+  fun show() {
+    hidden = false
+  }
+
+  fun onScreenSize(widthDp: Int, heightDp: Int) {
+    val known = screenWidthDp != 0 || screenHeightDp != 0
+    if (known && (widthDp != screenWidthDp || heightDp != screenHeightDp)) clear()
+    screenWidthDp = widthDp
+    screenHeightDp = heightDp
+  }
+
+  fun clear() {
+    kept.forEach(free)
+    kept.clear()
+  }
+
+  private fun matches(bitmap: B): Boolean = widthOf(bitmap) == width && heightOf(bitmap) == height
+}

package/android/src/main/java/expo/modules/themereveal/KeptTarget.kt

@@ -0,0 +1,103 @@
+package expo.modules.themereveal
+
+import android.content.ComponentCallbacks2
+
+// GPU capture target kept between switches for the next first snapshot (GpuSnapshot.prepareOutput): at most one, made
+// in idle time, so the capture skips creating a renderer, surface and buffer. The capture takes it, and frees it if
+// the window has another size (freeLater, in a later main message). It's freed when the app is hidden or low on
+// memory, the screen changes size, the activity or module goes away, or the GPU path turns off. Main thread only.
+// Generic over the target type so JVM tests can run it.
+internal class KeptTarget<T : Any>(private val free: (T) -> Unit, private val freeLater: (T) -> Unit = free) {
+  // Off until a warm-up turns it on (the warmUp option).
+  var keep = false
+
+  private var held: T? = null
+  private var width = 0
+  private var height = 0
+  // Prepares in flight, including ones a clear made stale: their buffers exist until they end.
+  private var inFlight = 0
+
+  // A prepare that started before a clear ends with a stale ticket, so its target is freed.
+  private var ticket = 0
+
+  // App is hidden or the activity is gone, so keep nothing until the next capture or warm-up.
+  private var hidden = false
+  private var screenWidthDp = 0
+  private var screenHeightDp = 0
+
+  val size: Int get() = if (held == null) 0 else 1
+
+  // A prepare is holding the copy thread right now, stale or not.
+  val preparing: Boolean get() = inFlight > 0
+
+  // Whether a prepare of a width x height target needs to start now. gpuOn: the window's next capture takes the GPU
+  // path.
+  fun wants(width: Int, height: Int, gpuOn: Boolean): Boolean =
+    keep && !hidden && gpuOn && held == null && inFlight == 0 && width > 0 && height > 0
+
+  // A prepare starts. Its result goes to ready along with the ticket returned here.
+  fun started(): Int {
+    inFlight++
+    return ticket
+  }
+
+  // A prepare ended with its target, or null if it failed. Kept only if nothing cleared the target since the prepare
+  // started, keeping is on and nothing else is kept. Freed otherwise.
+  fun ready(ticket: Int, target: T?, width: Int, height: Int) {
+    val current = ticket == this.ticket
+    if (inFlight > 0) inFlight--
+    if (target == null) return
+    if (!current || !keep || hidden || held != null) {
+      free(target)
+      return
+    }
+    held = target
+    this.width = width
+    this.height = height
+  }
+
+  // Next capture of width x height: the kept target if it has that size. One of another size goes to freeLater.
+  fun take(width: Int, height: Int): T? {
+    hidden = false
+    val target = held ?: return null
+    held = null
+    if (width == this.width && height == this.height) return target
+    freeLater(target)
+    return null
+  }
+
+  // Frees a kept target the window's next capture can't use (another size, or no GPU path).
+  fun drop(width: Int, height: Int, gpuOn: Boolean) {
+    if (held != null && (!gpuOn || width != this.width || height != this.height)) clear()
+  }
+
+  fun onTrimMemory(level: Int) {
+    if (level >= ComponentCallbacks2.TRIM_MEMORY_UI_HIDDEN) hide()
+  }
+
+  // Frees the target and keeps none until the next capture or show.
+  fun hide() {
+    hidden = true
+    clear()
+  }
+
+  // A warm-up from a mounted UI: keep a target again.
+  fun show() {
+    hidden = false
+  }
+
+  fun onScreenSize(widthDp: Int, heightDp: Int) {
+    val known = screenWidthDp != 0 || screenHeightDp != 0
+    if (known && (widthDp != screenWidthDp || heightDp != screenHeightDp)) clear()
+    screenWidthDp = widthDp
+    screenHeightDp = heightDp
+  }
+
+  // Frees the kept target, and the one a running prepare makes.
+  fun clear() {
+    ticket++
+    val target = held ?: return
+    held = null
+    free(target)
+  }
+}

package/android/src/main/java/expo/modules/themereveal/Motion.kt

@@ -0,0 +1,79 @@
+package expo.modules.themereveal
+
+import android.os.Build
+import kotlin.math.hypot
+import kotlin.math.max
+import kotlin.math.min
+import kotlin.math.pow
+import kotlin.math.roundToInt
+
+internal data class Frame(val left: Int, val top: Int, val right: Int, val bottom: Int) {
+  val isEmpty: Boolean get() = right <= left || bottom <= top
+}
+
+internal object Motion {
+  private const val GROWTH_CURVE = 1.4
+  private const val EASE_X1 = 0.65f
+  private const val EASE_Y1 = 0f
+  private const val EASE_X2 = 0.35f
+  private const val EASE_Y2 = 1f
+  private const val EASE_STEPS = 24
+  private const val MAX_DURATION_MS = 10_000L
+
+  fun growth(g: Double, from: Double, to: Double): Double = from * (to / from).pow(g.pow(GROWTH_CURVE))
+
+  fun shrink(g: Double, from: Double, to: Double): Double = max(0.0, growth(1 - g, from, to) - from * g)
+
+  // For an animator whose radius runs from r0 to r1 as r0 + (r1 - r0) * fraction: the fraction that gives growth's
+  // radius at time g. r1 > r0 > 0.
+  fun growthFraction(g: Double, r0: Double, r1: Double): Double =
+    ((growth(g.coerceIn(0.0, 1.0), r0, r1) - r0) / (r1 - r0)).coerceIn(0.0, 1.0)
+
+  // For an animator whose radius runs from r1 to 0 as r1 * (1 - fraction): the fraction that gives shrink's radius
+  // at time g. r1 > r0 > 0.
+  fun shrinkFraction(g: Double, r0: Double, r1: Double): Double =
+    (1 - shrink(g.coerceIn(0.0, 1.0), r0, r1) / r1).coerceIn(0.0, 1.0)
+
+  fun coverScale(originX: Float, originY: Float, width: Int, height: Int, inscribedRadiusPx: Float): Float =
+    hypot(max(originX, width - originX), max(originY, height - originY)) / inscribedRadiusPx
+
+  fun easeInOut(t: Float): Float {
+    if (t <= 0f) return 0f
+    if (t >= 1f) return 1f
+    var lo = 0f
+    var hi = 1f
+    repeat(EASE_STEPS) {
+      val mid = (lo + hi) / 2
+      if (bezier(mid, EASE_X1, EASE_X2) < t) lo = mid else hi = mid
+    }
+    return bezier((lo + hi) / 2, EASE_Y1, EASE_Y2)
+  }
+
+  // Non-finite, zero, negative or overlong durations are invalid: the overlay would sit on screen too long.
+  fun durationMs(ms: Double): Long? =
+    if (!ms.isFinite() || ms > MAX_DURATION_MS) null else ms.toLong().takeIf { it > 0 }
+
+  fun canAnimate(apiLevel: Int, resumed: Boolean): Boolean = apiLevel >= Build.VERSION_CODES.O && resumed
+
+  fun sameSize(snapshotW: Int, snapshotH: Int, w: Int, h: Int): Boolean = snapshotW == w && snapshotH == h
+
+  fun dialogFrame(decorX: Int, decorY: Int, decorW: Int, decorH: Int, screenW: Int, screenH: Int): Frame =
+    Frame(max(decorX, 0), max(decorY, 0), min(decorX + decorW, screenW), min(decorY + decorH, screenH))
+
+  fun dimAlpha(dimAmount: Float): Int = if (dimAmount.isNaN()) 0 else (dimAmount.coerceIn(0f, 1f) * 255).roundToInt()
+
+  fun toOverlay(
+    xPx: Float,
+    yPx: Float,
+    rootScreenX: Int,
+    rootScreenY: Int,
+    overlayScreenX: Int,
+    overlayScreenY: Int,
+  ): FloatArray =
+    floatArrayOf(xPx + (rootScreenX - overlayScreenX), yPx + (rootScreenY - overlayScreenY))
+
+  private fun bezier(s: Float, p1: Float, p2: Float): Float {
+    val u = 1 - s
+    return 3 * u * u * s * p1 + 3 * u * s * s * p2 + s * s * s
+  }
+}

package/android/src/main/java/expo/modules/themereveal/Once.kt

@@ -0,0 +1,13 @@
+package expo.modules.themereveal
+
+// Runs action on the first call to run and never again, even if it throws. For an action several triggers race for.
+// Main thread only.
+internal class Once(private val action: () -> Unit) {
+  private var done = false
+
+  fun run() {
+    if (done) return
+    done = true
+    action()
+  }
+}

package/android/src/main/java/expo/modules/themereveal/RenderThreadReveal.kt

@@ -0,0 +1,107 @@
+package expo.modules.themereveal
+
+import android.animation.TimeInterpolator
+import android.os.Build
+
+// Interpolators for ViewAnimationUtils.createCircularReveal that reproduce the UI-thread reveal's radius curves.
+// RenderNodeAnimator bakes a non-native interpolator into a lookup table, so the animation still runs on the
+// RenderThread.
+internal class GrowthInterpolator(private val r0: Float, private val r1: Float) : TimeInterpolator {
+  override fun getInterpolation(input: Float): Float =
+    Motion.growthFraction(input.toDouble(), r0.toDouble(), r1.toDouble()).toFloat()
+}
+
+internal class ShrinkInterpolator(private val r0: Float, private val r1: Float) : TimeInterpolator {
+  override fun getInterpolation(input: Float): Float =
+    Motion.shrinkFraction(input.toDouble(), r0.toDouble(), r1.toDouble()).toFloat()
+}
+
+// Where a reveal's animation runs.
+internal enum class RevealPath {
+  // A second snapshot of the new screen, revealed by a circular clip that grows on the RenderThread.
+  RENDER_THREAD_REVEAL,
+
+  // A circular clip on the old snapshot that shrinks on the RenderThread.
+  RENDER_THREAD_INVERSE,
+
+  // RevealOverlayView's ValueAnimator, which re-records the overlay every frame.
+  UI_THREAD,
+}
+
+internal object RevealPlan {
+  // Only the default circle can run on the RenderThread, since createCircularReveal only clips to a circle. Needs
+  // the GPU capture (API 29+): the second snapshot of the new screen is a GPU capture too, so both look the same.
+  // With animators off, the UI-thread path keeps today's behavior. secondSnapshotOff (FallbackCounter.off): the
+  // reveal's second snapshot failed too often in this process. The inverse reveal doesn't take one, so it stays.
+  fun path(
+    type: String,
+    customShape: Boolean,
+    apiLevel: Int,
+    snapshot: CapturePath,
+    animatorsEnabled: Boolean,
+    secondSnapshotOff: Boolean,
+  ): RevealPath {
+    if (customShape || apiLevel < Build.VERSION_CODES.Q || snapshot != CapturePath.GPU || !animatorsEnabled) {
+      return RevealPath.UI_THREAD
+    }
+    return when (type) {
+      "reveal" -> if (secondSnapshotOff) RevealPath.UI_THREAD else RevealPath.RENDER_THREAD_REVEAL
+      "inverseReveal" -> RevealPath.RENDER_THREAD_INVERSE
+      else -> RevealPath.UI_THREAD
+    }
+  }
+
+  // Default circle's start and end radius in px for a reveal from (x, y) in a width x height overlay, matching what
+  // the UI-thread reveal draws: ShapePath.circle() has radius 1 and height 2, so it starts at startHeightPx / 2 and
+  // ends at the cover radius.
+  fun circleRadii(x: Float, y: Float, width: Int, height: Int, startHeightPx: Float): FloatArray =
+    floatArrayOf(startHeightPx / 2f, Motion.coverScale(x, y, width, height, 1f))
+
+  // Second snapshot can go over the first: the overlay is the same view, still in the window, and the snapshot is a
+  // GPU capture of the same window at the same size and position.
+  fun secondMatches(
+    sameOverlay: Boolean,
+    attached: Boolean,
+    sameHost: Boolean,
+    gpu: Boolean,
+    width: Int,
+    height: Int,
+    firstWidth: Int,
+    firstHeight: Int,
+    sameOffset: Boolean,
+  ): Boolean =
+    sameOverlay && attached && sameHost && gpu && Motion.sameSize(width, height, firstWidth, firstHeight) && sameOffset
+
+  // Circle has to grow from a positive, finite radius.
+  fun radiiUsable(r0: Float, r1: Float): Boolean = r0 > 0f && r1 > r0 && r1.isFinite()
+
+  // A fallback only counts toward FallbackCounter if it tells us something about the second snapshot, i.e. the
+  // overlay is still in an open window of a resumed activity. In the background no frame comes, so the wait times
+  // out anyway.
+  fun countsFallBack(windowOk: Boolean, resumed: Boolean): Boolean = windowOk && resumed
+
+  // Fallbacks in a row that turn off the reveal's second snapshot (FallbackCounter).
+  const val FALLBACKS_TO_OFF = 3
+
+  // A held GPU snapshot gets its texture imported during the hold so the overlay's first frame doesn't have to.
+  fun preImports(apiLevel: Int, snapshot: CapturePath): Boolean =
+    apiLevel >= Build.VERSION_CODES.Q && snapshot == CapturePath.GPU
+}
+
+// Counts consecutive RenderThread reveals that fell back to the UI-thread reveal. After limit of them, off stays
+// true for the rest of the process: each such fallback cost the switch up to SecondSnapshotWait.TIMEOUT_MS. Main
+// thread only.
+internal class FallbackCounter(private val limit: Int) {
+  var off = false
+    private set
+  private var inARow = 0
+
+  fun fellBack() {
+    inARow++
+    if (inARow >= limit) off = true
+  }
+
+  fun revealed() {
+    inARow = 0
+  }
+}

package/android/src/main/java/expo/modules/themereveal/RevealOverlayView.kt

@@ -0,0 +1,192 @@
+package expo.modules.themereveal
+
+import android.animation.Animator
+import android.animation.AnimatorListenerAdapter
+import android.animation.ValueAnimator
+import android.annotation.SuppressLint
+import android.content.Context
+import android.graphics.Bitmap
+import android.graphics.Canvas
+import android.graphics.Matrix
+import android.graphics.Path
+import android.graphics.RectF
+import android.graphics.Region
+import android.os.Build
+import android.view.MotionEvent
+import android.view.View
+import android.view.animation.LinearInterpolator
+
+internal enum class WipeDirection { UP, DOWN, LEFT, RIGHT }
+
+@SuppressLint("ViewConstructor")
+internal class RevealOverlayView(context: Context, private val snapshot: Bitmap) : View(context) {
+  private enum class Mode { STILL, REVEAL, INVERSE_REVEAL, WIPE, CROSSFADE }
+
+  private val hole = Path()
+  private val holeMatrix = Matrix()
+  private val wipeClip = RectF()
+  private var mode = Mode.STILL
+  private var shape: ShapePath? = null
+  private var originX = 0f
+  private var originY = 0f
+  private var fromScale = 0.0
+  private var toScale = 0.0
+  private var scale = 0f
+  private var wipeDirection = WipeDirection.UP
+  private var animator: ValueAnimator? = null
+
+  val snapshotWidth: Int get() = snapshot.width
+  val snapshotHeight: Int get() = snapshot.height
+
+  // The path that took the snapshot.
+  val snapshotPath: CapturePath get() = WindowSnapshot.pathOf(snapshot)
+
+  // Height in px of the shape when the reveal starts.
+  val startHeightPx: Float get() = START_HEIGHT_DP * resources.displayMetrics.density
+
+  init {
+    isClickable = false
+    isFocusable = false
+    importantForAccessibility = IMPORTANT_FOR_ACCESSIBILITY_NO_HIDE_DESCENDANTS
+  }
+
+  @SuppressLint("ClickableViewAccessibility")
+  override fun dispatchTouchEvent(event: MotionEvent): Boolean = false
+
+  fun reveal(shape: ShapePath, x: Float, y: Float, inverse: Boolean, durationMs: Long, onEnd: () -> Unit) {
+    this.shape = shape
+    originX = x
+    originY = y
+    fromScale = (startHeightPx / shape.bounds.height()).toDouble()
+    toScale = Motion.coverScale(x, y, snapshot.width, snapshot.height, shape.effectiveInscribedRadius).toDouble()
+    play(if (inverse) Mode.INVERSE_REVEAL else Mode.REVEAL, durationMs, onEnd)
+  }
+
+  // Debug only, slow: the snapshot's color at (x, y), read back to the CPU. Null if it can't be read.
+  fun pixelAt(x: Int, y: Int): Int? {
+    if (snapshot.isRecycled || x !in 0 until snapshot.width || y !in 0 until snapshot.height) return null
+    return try {
+      val copy = snapshot.copy(Bitmap.Config.ARGB_8888, false) ?: return null
+      try {
+        copy.getPixel(x, y)
+      } finally {
+        copy.recycle()
+      }
+    } catch (_: RuntimeException) {
+      null
+    }
+  }
+
+  fun wipe(direction: WipeDirection, durationMs: Long, onEnd: () -> Unit) {
+    wipeDirection = direction
+    wipeClip.set(0f, 0f, snapshot.width.toFloat(), snapshot.height.toFloat())
+    play(Mode.WIPE, durationMs, onEnd)
+  }
+
+  fun crossfade(durationMs: Long, onEnd: () -> Unit) {
+    setLayerType(LAYER_TYPE_HARDWARE, null)
+    play(Mode.CROSSFADE, durationMs, onEnd)
+  }
+
+  // Stops an animation from an earlier start and shows the whole snapshot again, static.
+  fun still() {
+    if (mode == Mode.STILL && animator == null) return
+    stopAnimator()
+    mode = Mode.STILL
+    alpha = 1f
+    setLayerType(LAYER_TYPE_NONE, null)
+    invalidate()
+  }
+
+  // Stops the animation and hands the snapshot off, either to the kept bitmaps or to be freed.
+  fun release(drop: (Bitmap) -> Unit) {
+    stopAnimator()
+    drop(snapshot)
+  }
+
+  private fun stopAnimator() {
+    animator?.removeAllUpdateListeners()
+    animator?.removeAllListeners()
+    animator?.cancel()
+    animator = null
+  }
+
+  private fun play(next: Mode, durationMs: Long, onEnd: () -> Unit) {
+    stopAnimator()
+    mode = next
+    onFrame(0f)
+    animator = ValueAnimator.ofFloat(0f, 1f).apply {
+      duration = durationMs
+      interpolator = LinearInterpolator()
+      addUpdateListener { onFrame(it.animatedFraction) }
+      addListener(object : AnimatorListenerAdapter() {
+        override fun onAnimationEnd(animation: Animator) = onEnd()
+      })
+      start()
+    }
+  }
+
+  private fun onFrame(fraction: Float) {
+    when (mode) {
+      Mode.REVEAL -> scale = Motion.growth(fraction.toDouble(), fromScale, toScale).toFloat()
+      Mode.INVERSE_REVEAL -> scale = Motion.shrink(fraction.toDouble(), fromScale, toScale).toFloat()
+      Mode.WIPE -> moveWipeEdge(Motion.easeInOut(fraction))
+      Mode.CROSSFADE -> {
+        alpha = 1f - Motion.easeInOut(fraction)
+        return
+      }
+      Mode.STILL -> return
+    }
+    invalidate()
+  }
+
+  private fun moveWipeEdge(progress: Float) {
+    val w = snapshot.width.toFloat()
+    val h = snapshot.height.toFloat()
+    when (wipeDirection) {
+      WipeDirection.UP -> wipeClip.set(0f, 0f, w, h * (1f - progress))
+      WipeDirection.DOWN -> wipeClip.set(0f, h * progress, w, h)
+      WipeDirection.LEFT -> wipeClip.set(0f, 0f, w * (1f - progress), h)
+      WipeDirection.RIGHT -> wipeClip.set(w * progress, 0f, w, h)
+    }
+  }
+
+  override fun onDraw(canvas: Canvas) {
+    if (snapshot.isRecycled) return
+    // A software canvas (a screenshot drawn with View.draw, say) throws on a hardware bitmap, so leave it out.
+    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O && snapshot.config == Bitmap.Config.HARDWARE &&
+      !canvas.isHardwareAccelerated
+    ) {
+      return
+    }
+    when (mode) {
+      Mode.REVEAL -> if (scale > 0f) clipOut(canvas, shapeAtScale())
+      Mode.INVERSE_REVEAL -> canvas.clipPath(shapeAtScale())
+      Mode.WIPE -> canvas.clipRect(wipeClip)
+      Mode.CROSSFADE, Mode.STILL -> Unit
+    }
+    canvas.drawBitmap(snapshot, 0f, 0f, null)
+  }
+
+  private fun shapeAtScale(): Path {
+    val current = shape ?: return hole.apply { reset() }
+    holeMatrix.setTranslate(-current.anchorX, -current.anchorY)
+    holeMatrix.postScale(scale, scale)
+    holeMatrix.postTranslate(originX, originY)
+    current.path.transform(holeMatrix, hole)
+    return hole
+  }
+
+  private fun clipOut(canvas: Canvas, path: Path) {
+    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
+      canvas.clipOutPath(path)
+    } else {
+      @Suppress("DEPRECATION")
+      canvas.clipPath(path, Region.Op.DIFFERENCE)
+    }
+  }
+
+  private companion object {
+    const val START_HEIGHT_DP = 24f
+  }
+}