react-native-photo-video-editor 0.1.0

package/android/src/main/java/com/photovideoeditor/photo/render/PhotoLayer.kt

@@ -0,0 +1,54 @@
+package com.photovideoeditor.photo.render
+
+import android.graphics.Color
+import java.util.UUID
+
+enum class LayerType { TEXT, STICKER, OVERLAY }
+
+/**
+ * A single non-destructive overlay layer (text, sticker, or uploaded image
+ * overlay). One flat model covers every type for simplicity — a documented
+ * simplification versus a sealed-class-per-type hierarchy.
+ *
+ * `x`/`y` are the layer's center, normalized 0..1 against the image.
+ */
+data class PhotoLayer(
+  val id: String = UUID.randomUUID().toString(),
+  val type: LayerType,
+  var x: Float = 0.5f,
+  var y: Float = 0.5f,
+  var scale: Float = 1f,
+  var rotationDegrees: Float = 0f,
+  var opacity: Float = 1f,
+  var locked: Boolean = false,
+  var visible: Boolean = true,
+  // Text
+  var text: String = "",
+  var textColor: Int = Color.WHITE,
+  var fontSize: Float = 48f,
+  var fontFamily: String? = null,
+  // Sticker
+  var stickerId: String? = null,
+  var stickerUri: String? = null,
+  // Overlay (uploaded image)
+  var overlayUri: String? = null,
+  var overlayAspectRatio: Float? = null,
+  // Timing (video overlays only; ignored for photo layers). endMs <= 0 means "to end of video".
+  var startMs: Long = 0L,
+  var endMs: Long = 0L
+) {
+  fun effectiveEndMs(durationMs: Long): Long = if (endMs in 1..durationMs) endMs else durationMs
+
+  /** True if this layer should be visible at [positionMs] against a video of [durationMs]. Always true for photo layers. */
+  fun isActiveAt(positionMs: Long, durationMs: Long): Boolean {
+    if (!visible || durationMs < 0) return false
+    val clamped = positionMs.coerceAtLeast(0L)
+    if (clamped < startMs.coerceAtLeast(0L)) return false
+    // No explicit end (or one at/past the video's end) means "visible through the real last
+    // frame" — don't compare against `durationMs`, which is a separately-computed estimate
+    // (summed clip-trim durations) that can be a few ms shy of the true final frame's
+    // timestamp due to frame-rate rounding, which would otherwise hide the overlay early.
+    if (endMs <= 0 || endMs >= durationMs) return true
+    return clamped <= endMs
+  }
+}

package/android/src/main/java/com/photovideoeditor/photo/render/PhotoLayerRenderer.kt

@@ -0,0 +1,108 @@
+package com.photovideoeditor.photo.render
+
+import android.graphics.Bitmap
+import android.graphics.Canvas
+import android.graphics.Paint
+import android.graphics.RectF
+import android.text.TextPaint
+
+/**
+ * Burns the layer stack onto a bitmap. Used identically by the live preview
+ * and the exporter (different bitmap resolutions, same code and normalized
+ * coordinates) so what you see matches what gets exported.
+ */
+object PhotoLayerRenderer {
+  private val builtinStickers = mapOf(
+    "smile" to "😀",
+    "heart" to "❤️",
+    "star" to "⭐",
+    "fire" to "🔥",
+    "thumbsUp" to "👍",
+    "sun" to "☀️",
+    "clap" to "👏",
+    "sparkles" to "✨"
+  )
+
+  fun builtinStickerIds(): List<String> = builtinStickers.keys.toList()
+  fun glyphFor(stickerId: String): String = builtinStickers[stickerId] ?: "★"
+
+  fun render(base: Bitmap, layers: List<PhotoLayer>, bitmapResolver: (String) -> Bitmap?): Bitmap {
+    if (layers.isEmpty()) return base
+    val result = base.copy(Bitmap.Config.ARGB_8888, true)
+    val canvas = Canvas(result)
+    layers.filter { it.visible }.forEach { layer ->
+      val geometry = OverlayGeometry.map(layer, result.width, result.height)
+      canvas.save()
+      canvas.translate(geometry.centerX, geometry.centerY)
+      canvas.rotate(geometry.rotationDegrees)
+      canvas.scale(geometry.scale, geometry.scale)
+      val alpha = (geometry.opacity * 255).toInt()
+      when (layer.type) {
+        LayerType.TEXT -> drawText(canvas, layer, geometry.shortSide, alpha)
+        LayerType.STICKER -> drawSticker(canvas, layer, geometry.shortSide, alpha, bitmapResolver)
+        LayerType.OVERLAY -> drawOverlay(canvas, layer, geometry.shortSide, alpha, bitmapResolver)
+      }
+      canvas.restore()
+    }
+    return result
+  }
+
+  private fun drawText(canvas: Canvas, layer: PhotoLayer, shortSide: Float, alpha: Int) {
+    val paint = TextPaint(Paint.ANTI_ALIAS_FLAG).apply {
+      color = layer.textColor
+      this.alpha = alpha
+      textSize = layer.fontSize / 48f * (shortSide * 0.06f)
+      textAlign = Paint.Align.CENTER
+      layer.fontFamily?.let { family ->
+        try {
+          typeface = android.graphics.Typeface.create(family, android.graphics.Typeface.NORMAL)
+        } catch (_: Exception) {
+          // Fall back to the default typeface if the family cannot be resolved.
+        }
+      }
+    }
+    val lines = layer.text.ifBlank { " " }.split("\n")
+    val lineHeight = paint.fontSpacing
+    val totalHeight = lineHeight * lines.size
+    lines.forEachIndexed { index, line ->
+      canvas.drawText(line, 0f, -totalHeight / 2f + lineHeight * (index + 1) - paint.descent(), paint)
+    }
+  }
+
+  private fun drawSticker(canvas: Canvas, layer: PhotoLayer, shortSide: Float, alpha: Int, resolver: (String) -> Bitmap?) {
+    val size = shortSide * 0.18f
+    val uri = layer.stickerUri
+    if (uri != null) {
+      resolver(uri)?.let { bitmap ->
+        val paint = Paint(Paint.ANTI_ALIAS_FLAG).apply { this.alpha = alpha }
+        canvas.drawBitmap(bitmap, null, RectF(-size / 2, -size / 2, size / 2, size / 2), paint)
+        return
+      }
+    }
+    val glyph = layer.stickerId?.let { glyphFor(it) } ?: "★"
+    val paint = TextPaint(Paint.ANTI_ALIAS_FLAG).apply {
+      this.alpha = alpha
+      textSize = size
+      textAlign = Paint.Align.CENTER
+    }
+    canvas.drawText(glyph, 0f, size / 2f - paint.descent(), paint)
+  }
+
+  private fun drawOverlay(canvas: Canvas, layer: PhotoLayer, shortSide: Float, alpha: Int, resolver: (String) -> Bitmap?) {
+    val uri = layer.overlayUri ?: return
+    val bitmap = resolver(uri) ?: return
+    val aspect = layer.overlayAspectRatio ?: (bitmap.width.toFloat() / bitmap.height.toFloat())
+    val baseSize = shortSide * 0.6f
+    val width: Float
+    val height: Float
+    if (aspect >= 1f) {
+      width = baseSize
+      height = baseSize / aspect
+    } else {
+      height = baseSize
+      width = baseSize * aspect
+    }
+    val paint = Paint(Paint.ANTI_ALIAS_FLAG).apply { this.alpha = alpha }
+    canvas.drawBitmap(bitmap, null, RectF(-width / 2, -height / 2, width / 2, height / 2), paint)
+  }
+}

package/android/src/main/java/com/photovideoeditor/photo/render/PhotoLayerStack.kt

@@ -0,0 +1,60 @@
+package com.photovideoeditor.photo.render
+
+/**
+ * Ordered layer stack with snapshot-based undo/redo. One entry is pushed per
+ * *committed* operation (add/delete/duplicate/reorder, or a drag/slider
+ * gesture's final value) — never per intermediate touch-move frame — so a
+ * continuous drag does not flood the history.
+ */
+class PhotoLayerStack(private val historyLimit: Int = 50) {
+  var layers: List<PhotoLayer> = emptyList()
+    private set
+  var revision: Long = 0
+    private set
+
+  private val undoStack = ArrayDeque<List<PhotoLayer>>()
+  private val redoStack = ArrayDeque<List<PhotoLayer>>()
+
+  val canUndo: Boolean get() = undoStack.isNotEmpty()
+  val canRedo: Boolean get() = redoStack.isNotEmpty()
+
+  /** Applies [mutation] as a single committed, undoable operation. */
+  fun commit(mutation: (List<PhotoLayer>) -> List<PhotoLayer>) {
+    pushUndo(layers)
+    redoStack.clear()
+    layers = mutation(layers)
+    revision++
+  }
+
+  /** Updates the live layer list without creating a history entry — for in-progress drags. */
+  fun updateLive(mutation: (List<PhotoLayer>) -> List<PhotoLayer>) {
+    layers = mutation(layers)
+    revision++
+  }
+
+  /** Records [previousLayers] (captured before a live-updated gesture began) as one undo step. */
+  fun commitSnapshot(previousLayers: List<PhotoLayer>) {
+    pushUndo(previousLayers)
+    redoStack.clear()
+    revision++
+  }
+
+  fun undo() {
+    val previous = undoStack.removeLastOrNull() ?: return
+    redoStack.addLast(layers)
+    layers = previous
+    revision++
+  }
+
+  fun redo() {
+    val next = redoStack.removeLastOrNull() ?: return
+    undoStack.addLast(layers)
+    layers = next
+    revision++
+  }
+
+  private fun pushUndo(snapshot: List<PhotoLayer>) {
+    undoStack.addLast(snapshot)
+    if (undoStack.size > historyLimit) undoStack.removeFirst()
+  }
+}

package/android/src/main/java/com/photovideoeditor/photo/render/PhotoTransformState.kt

@@ -0,0 +1,52 @@
+package com.photovideoeditor.photo.render
+
+import android.graphics.Matrix
+
+/**
+ * Non-destructive photo edit state. The crop rectangle is normalized (0..1)
+ * against the *transformed* (rotated/straightened) image, matching
+ * what the user sees in the crop overlay — the original source file is never
+ * modified, only read again at export time.
+ */
+data class PhotoTransformState(
+  val cropLeft: Float = 0f,
+  val cropTop: Float = 0f,
+  val cropRight: Float = 1f,
+  val cropBottom: Float = 1f,
+  val rotationDegrees: Int = 0,
+  val straightenDegrees: Float = 0f,
+  val aspectRatio: Float? = null
+) {
+  val isIdentity: Boolean
+    get() = cropLeft == 0f && cropTop == 0f && cropRight == 1f && cropBottom == 1f &&
+      rotationDegrees == 0 && straightenDegrees == 0f
+
+  /** Rotating changes which pixels a normalized crop rect refers to, so the crop resets to full-frame. */
+  fun rotatedRight(): PhotoTransformState = copy(
+    rotationDegrees = (rotationDegrees + 90) % 360,
+    cropLeft = 0f,
+    cropTop = 0f,
+    cropRight = 1f,
+    cropBottom = 1f
+  )
+
+  fun withStraighten(degrees: Float): PhotoTransformState = copy(straightenDegrees = degrees.coerceIn(-45f, 45f))
+
+  fun withCrop(left: Float, top: Float, right: Float, bottom: Float): PhotoTransformState = copy(
+    cropLeft = left.coerceIn(0f, 1f),
+    cropTop = top.coerceIn(0f, 1f),
+    cropRight = right.coerceIn(0f, 1f),
+    cropBottom = bottom.coerceIn(0f, 1f)
+  )
+
+  fun withAspectRatio(ratio: Float?): PhotoTransformState = copy(aspectRatio = ratio)
+
+  fun reset(): PhotoTransformState = PhotoTransformState()
+
+  /** Combined rotate + straighten matrix, applied around the bitmap's own origin/size by the caller. */
+  fun toMatrix(): Matrix {
+    val matrix = Matrix()
+    matrix.postRotate(rotationDegrees.toFloat() + straightenDegrees)
+    return matrix
+  }
+}

package/android/src/main/java/com/photovideoeditor/photo/ui/CropOverlayView.kt

@@ -0,0 +1,168 @@
+package com.photovideoeditor.photo.ui
+
+import android.content.Context
+import android.graphics.Canvas
+import android.graphics.Color
+import android.graphics.Paint
+import android.graphics.RectF
+import android.view.MotionEvent
+import android.view.View
+import kotlin.math.abs
+
+/**
+ * Draws a draggable/resizable crop rectangle over [imageBounds] (the on-screen
+ * rect of the preview image, in this view's own coordinate space) and reports
+ * the crop edges back normalized to that rect via [onCropChanged].
+ */
+class CropOverlayView(context: Context) : View(context) {
+  private var imageBounds = RectF()
+  private var cropRect = RectF()
+  private var aspectRatio: Float? = null
+  var onCropChanged: ((left: Float, top: Float, right: Float, bottom: Float) -> Unit)? = null
+
+  private val dimPaint = Paint().apply { color = Color.argb(153, 0, 0, 0) }
+  private val borderPaint = Paint().apply { color = Color.WHITE; style = Paint.Style.STROKE; strokeWidth = 3f }
+  private val gridPaint = Paint().apply { color = Color.argb(120, 255, 255, 255); style = Paint.Style.STROKE; strokeWidth = 1f }
+  private val handlePaint = Paint().apply { color = Color.WHITE; style = Paint.Style.FILL }
+
+  private val handleTouchRadius = 56f
+  private val minSizePx = 96f
+  private var activeHandle = Handle.NONE
+  private var lastX = 0f
+  private var lastY = 0f
+
+  private enum class Handle { NONE, MOVE, TOP_LEFT, TOP_RIGHT, BOTTOM_LEFT, BOTTOM_RIGHT }
+
+  /** Sets the on-screen image rect this overlay crops against. Resets the crop to full-frame when [resetCrop] is true. */
+  fun setImageBounds(bounds: RectF, resetCrop: Boolean) {
+    imageBounds = RectF(bounds)
+    if (resetCrop || cropRect.width() <= 0f || cropRect.height() <= 0f) {
+      cropRect = RectF(imageBounds)
+      reportCrop()
+    }
+    invalidate()
+  }
+
+  fun setAspectRatio(ratio: Float?) {
+    aspectRatio = ratio
+    if (ratio != null && imageBounds.width() > 0 && imageBounds.height() > 0) {
+      val centerX = cropRect.centerX()
+      val centerY = cropRect.centerY()
+      var width = cropRect.width()
+      var height = width / ratio
+      if (height > imageBounds.height()) {
+        height = cropRect.height()
+        width = height * ratio
+      }
+      cropRect = RectF(centerX - width / 2, centerY - height / 2, centerX + width / 2, centerY + height / 2)
+      clampToImageBounds()
+      invalidate()
+    }
+    reportCrop()
+  }
+
+  override fun onDraw(canvas: Canvas) {
+    super.onDraw(canvas)
+    if (imageBounds.width() <= 0 || imageBounds.height() <= 0) return
+    canvas.drawRect(imageBounds.left, imageBounds.top, imageBounds.right, cropRect.top, dimPaint)
+    canvas.drawRect(imageBounds.left, cropRect.bottom, imageBounds.right, imageBounds.bottom, dimPaint)
+    canvas.drawRect(imageBounds.left, cropRect.top, cropRect.left, cropRect.bottom, dimPaint)
+    canvas.drawRect(cropRect.right, cropRect.top, imageBounds.right, cropRect.bottom, dimPaint)
+    canvas.drawRect(cropRect, borderPaint)
+    val thirdWidth = cropRect.width() / 3
+    val thirdHeight = cropRect.height() / 3
+    for (i in 1..2) {
+      canvas.drawLine(cropRect.left + thirdWidth * i, cropRect.top, cropRect.left + thirdWidth * i, cropRect.bottom, gridPaint)
+      canvas.drawLine(cropRect.left, cropRect.top + thirdHeight * i, cropRect.right, cropRect.top + thirdHeight * i, gridPaint)
+    }
+    listOf(
+      cropRect.left to cropRect.top,
+      cropRect.right to cropRect.top,
+      cropRect.left to cropRect.bottom,
+      cropRect.right to cropRect.bottom
+    ).forEach { (x, y) -> canvas.drawCircle(x, y, 8f, handlePaint) }
+  }
+
+  override fun onTouchEvent(event: MotionEvent): Boolean {
+    when (event.actionMasked) {
+      MotionEvent.ACTION_DOWN -> {
+        activeHandle = hitTest(event.x, event.y)
+        lastX = event.x
+        lastY = event.y
+        return activeHandle != Handle.NONE
+      }
+      MotionEvent.ACTION_MOVE -> {
+        if (activeHandle == Handle.NONE) return false
+        val dx = event.x - lastX
+        val dy = event.y - lastY
+        lastX = event.x
+        lastY = event.y
+        applyDrag(activeHandle, dx, dy)
+        invalidate()
+        reportCrop()
+        return true
+      }
+      MotionEvent.ACTION_UP, MotionEvent.ACTION_CANCEL -> {
+        val handled = activeHandle != Handle.NONE
+        activeHandle = Handle.NONE
+        return handled
+      }
+    }
+    return super.onTouchEvent(event)
+  }
+
+  private fun hitTest(x: Float, y: Float): Handle {
+    fun near(px: Float, py: Float) = abs(x - px) < handleTouchRadius && abs(y - py) < handleTouchRadius
+    return when {
+      near(cropRect.left, cropRect.top) -> Handle.TOP_LEFT
+      near(cropRect.right, cropRect.top) -> Handle.TOP_RIGHT
+      near(cropRect.left, cropRect.bottom) -> Handle.BOTTOM_LEFT
+      near(cropRect.right, cropRect.bottom) -> Handle.BOTTOM_RIGHT
+      cropRect.contains(x, y) -> Handle.MOVE
+      else -> Handle.NONE
+    }
+  }
+
+  private fun applyDrag(handle: Handle, dx: Float, dy: Float) {
+    val proposed = RectF(cropRect)
+    when (handle) {
+      Handle.MOVE -> proposed.offset(dx, dy)
+      Handle.TOP_LEFT -> { proposed.left += dx; proposed.top += dy }
+      Handle.TOP_RIGHT -> { proposed.right += dx; proposed.top += dy }
+      Handle.BOTTOM_LEFT -> { proposed.left += dx; proposed.bottom += dy }
+      Handle.BOTTOM_RIGHT -> { proposed.right += dx; proposed.bottom += dy }
+      Handle.NONE -> return
+    }
+    if (proposed.width() < minSizePx || proposed.height() < minSizePx) return
+    aspectRatio?.let { ratio ->
+      when (handle) {
+        Handle.TOP_LEFT, Handle.BOTTOM_RIGHT -> proposed.bottom = proposed.top + proposed.width() / ratio
+        Handle.TOP_RIGHT -> proposed.top = proposed.bottom - proposed.width() / ratio
+        Handle.BOTTOM_LEFT -> proposed.bottom = proposed.top + proposed.width() / ratio
+        else -> {}
+      }
+    }
+    cropRect = proposed
+    clampToImageBounds()
+  }
+
+  private fun clampToImageBounds() {
+    if (cropRect.left < imageBounds.left) cropRect.offset(imageBounds.left - cropRect.left, 0f)
+    if (cropRect.top < imageBounds.top) cropRect.offset(0f, imageBounds.top - cropRect.top)
+    if (cropRect.right > imageBounds.right) cropRect.offset(imageBounds.right - cropRect.right, 0f)
+    if (cropRect.bottom > imageBounds.bottom) cropRect.offset(0f, imageBounds.bottom - cropRect.bottom)
+    cropRect.left = cropRect.left.coerceAtLeast(imageBounds.left)
+    cropRect.top = cropRect.top.coerceAtLeast(imageBounds.top)
+    cropRect.right = cropRect.right.coerceAtMost(imageBounds.right)
+    cropRect.bottom = cropRect.bottom.coerceAtMost(imageBounds.bottom)
+  }
+
+  private fun reportCrop() {
+    if (imageBounds.width() <= 0 || imageBounds.height() <= 0) return
+    val left = (cropRect.left - imageBounds.left) / imageBounds.width()
+    val top = (cropRect.top - imageBounds.top) / imageBounds.height()
+    val right = (cropRect.right - imageBounds.left) / imageBounds.width()
+    val bottom = (cropRect.bottom - imageBounds.top) / imageBounds.height()
+    onCropChanged?.invoke(left, top, right, bottom)
+  }
+}

package/android/src/main/java/com/photovideoeditor/photo/ui/FilterThumbnailLoader.kt

@@ -0,0 +1,57 @@
+package com.photovideoeditor.photo.ui
+
+import android.graphics.Bitmap
+import android.os.Handler
+import android.os.Looper
+import com.photovideoeditor.photo.render.PhotoAdjustmentRenderer
+import com.photovideoeditor.photo.render.PhotoAdjustments
+import java.util.concurrent.Executors
+import java.util.concurrent.atomic.AtomicBoolean
+
+/** Loads filter-card previews serially without blocking layout or touch input. */
+class FilterThumbnailLoader {
+  private val executor = Executors.newSingleThreadExecutor { task ->
+    Thread(task, "filter-thumbnail-loader").apply { priority = Thread.NORM_PRIORITY - 1 }
+  }
+  private val mainHandler = Handler(Looper.getMainLooper())
+  private val closed = AtomicBoolean(false)
+  private val cache = mutableMapOf<String, Bitmap>()
+
+  fun load(source: Bitmap?, presetId: String, sizePx: Int, deliver: (Bitmap?) -> Unit) {
+    if (source == null || closed.get()) {
+      deliver(null)
+      return
+    }
+    synchronized(cache) { cache[presetId] }?.let {
+      deliver(it)
+      return
+    }
+    // Capture a tiny independent input while the session bitmap is guaranteed alive.
+    val square = Bitmap.createScaledBitmap(source, sizePx, sizePx, true)
+    executor.execute {
+      if (closed.get()) {
+        if (square !== source && !square.isRecycled) square.recycle()
+        return@execute
+      }
+      val rendered = PhotoAdjustmentRenderer.apply(
+        square,
+        PhotoAdjustments(filterPreset = presetId, filterStrength = 100f),
+      )
+      if (rendered !== square && !square.isRecycled) square.recycle()
+      synchronized(cache) { cache[presetId] = rendered }
+      mainHandler.post { if (!closed.get()) deliver(rendered) }
+    }
+  }
+
+  fun close() {
+    if (!closed.compareAndSet(false, true)) return
+    mainHandler.removeCallbacksAndMessages(null)
+    executor.execute {
+      synchronized(cache) {
+        cache.values.distinct().forEach { if (!it.isRecycled) it.recycle() }
+        cache.clear()
+      }
+    }
+    executor.shutdown()
+  }
+}