react-native-blur-vibe 0.1.7 → 0.1.9

package/android/build.gradle

@@ -66,10 +66,10 @@ android {
 repositories {
     google()
     mavenCentral()
-    maven { url 'https://jitpack.io' }
+    //maven { url 'https://jitpack.io' }
   }
 
 dependencies {
   implementation "com.facebook.react:react-android"
-  implementation 'com.qmdeve.blurview:core:1.1.4'
+  //implementation 'com.qmdeve.blurview:core:1.1.4'
 }

package/android/src/main/java/com/blurvibe/BlurVibeView.kt

@@ -1,258 +1,160 @@
 package com.blurvibe
 
 import android.content.Context
+import android.graphics.Canvas
 import android.graphics.Color
 import android.graphics.Outline
 import android.util.TypedValue
 import android.view.View
 import android.view.ViewGroup
 import android.view.ViewOutlineProvider
-import android.view.ViewTreeObserver
 import androidx.core.graphics.toColorInt
-import com.qmdeve.blurview.base.BaseBlurViewGroup
-import com.qmdeve.blurview.widget.BlurViewGroup
+import com.facebook.react.views.view.ReactViewGroup
 
 /**
- * BlurVibeView — Android backdrop blur implementation
+ * BlurVibeView — Android API 21–30 backdrop blur (zero external dependencies)
  *
- * Extends QmBlurView's BlurViewGroup — a high-performance blur library
- * that correctly implements CSS backdrop-filter: blur() semantics:
- *   - Blurs content BEHIND the view, not the view itself
- *   - Hardware accelerated via native blur algorithms
- *   - Handles scroll, animation, zIndex, absolute positioning correctly
- *   - Never causes draw loops or bitmap capture on the JS thread
+ * Replaces QmBlurView with LegacyBlurController — a direct RenderScript
+ * implementation using only the Android SDK. No third-party library needed.
  *
- * Uses reflection to redirect the blur capture root from the activity
- * decor view to the nearest ReactRootView or react-native-screens Screen,
- * preventing full-screen blur and navigation transition artifacts.
+ * Extends ReactViewGroup so it hosts RN children correctly (Yoga layout,
+ * touch events, z-ordering all work natively).
  *
- * Credit: approach adapted from sbaiahmed1/react-native-blur
+ * For API 31+, BlurVibeViewApi31 is used instead (RenderEffect GPU path).
  */
-class BlurVibeView(context: Context) : BlurViewGroup(context, null) {
+class BlurVibeView(context: Context) : ReactViewGroup(context) {
 
-  private var currentBlurRadius = DEFAULT_BLUR_RADIUS
-  private var currentOverlayColor = Color.TRANSPARENT
-  private var currentCornerRadius = 0f
-  private var isBlurInitialized = false
+  // ── State ──────────────────────────────────────────────────────────────────
 
-  companion object {
-    private const val DEFAULT_BLUR_RADIUS = 10f
-    private const val MIN_BLUR_AMOUNT = 0f
-    private const val MAX_BLUR_AMOUNT = 100f
-    private const val MAX_BLUR_RADIUS = 25f  // QmBlurView Gaussian kernel designed for 0-25
+  private var blurController: LegacyBlurController? = null
+  private var pendingBlurAmount  = 10f
+  private var pendingOverlay     = Color.TRANSPARENT
+  private var cornerRadiusPx     = 0f
 
-    // Maps 0–100 blurAmount to 0–25 QmBlurView radius range.
-    // Uses a squared curve so low values (0–30) stay subtle and mid-high values
-    // (50–100) produce the strong frosted-glass spread seen in CSS backdrop-blur-md/lg/xl.
-    private fun mapBlurAmountToRadius(amount: Float): Float {
-      val t = amount.coerceIn(MIN_BLUR_AMOUNT, MAX_BLUR_AMOUNT) / MAX_BLUR_AMOUNT // 0.0–1.0
-      return t * t * MAX_BLUR_RADIUS  // quadratic: more spread at higher values
-    }
-  }
+  // ── Init ───────────────────────────────────────────────────────────────────
 
   init {
-    super.setBackgroundColor(currentOverlayColor)
-    clipChildren = true
+    setWillNotDraw(false)
+    super.setBackgroundColor(Color.TRANSPARENT)
     clipToOutline = true
-    blurRounds = 2          // 2 passes = smooth Gaussian spread (frosted glass quality)
-    super.setDownsampleFactor(4.0f)  // 1/4 res — eliminates pixelation, still fast
   }
 
+  // ── Lifecycle ──────────────────────────────────────────────────────────────
+
   override fun onAttachedToWindow() {
     super.onAttachedToWindow()
-    if (isBlurInitialized) return
-    swapBlurRootToOptimalAncestor()
-    initializeBlur()
+    val root = findBlurRoot() ?: return
+    blurController = LegacyBlurController(this, root).also {
+      it.blurRadius   = mapBlurAmount(pendingBlurAmount)
+      it.overlayColor = pendingOverlay
+    }
   }
 
   override fun onDetachedFromWindow() {
+    blurController?.destroy()
+    blurController = null
     super.onDetachedFromWindow()
-    isBlurInitialized = false
   }
 
-  private var frameScheduled = false
-
-  private val frameCallback = android.view.Choreographer.FrameCallback {
-    frameScheduled = false
-    try { invalidate() } catch (_: Exception) {}
+  override fun onSizeChanged(w: Int, h: Int, oldw: Int, oldh: Int) {
+    super.onSizeChanged(w, h, oldw, oldh)
+    blurController?.onSizeChanged()
   }
 
-  /**
-   * Redirects QmBlurView's internal preDrawListener from the old root to [newRoot].
-   * Also wraps it in a Choreographer gate so blur work fires at most ONCE per vsync,
-   * even when many views invalidate simultaneously (scroll, animation, etc).
-   */
-  private fun swapBlurRootToOptimalAncestor() {
-    val newRoot = findNearestScreenAncestor() ?: findNearestReactRootView() ?: return
-
-    try {
-      val blurViewGroupClass = BlurViewGroup::class.java
-      val baseField = blurViewGroupClass.getDeclaredField("mBaseBlurViewGroup")
-      baseField.isAccessible = true
-      val baseBlurViewGroup = baseField.get(this) ?: return
-
-      val baseClass = BaseBlurViewGroup::class.java
-
-      val decorViewField = baseClass.getDeclaredField("mDecorView")
-      decorViewField.isAccessible = true
-      val oldDecorView = decorViewField.get(baseBlurViewGroup) as? View
-
-      val preDrawListenerField = baseClass.getDeclaredField("preDrawListener")
-      preDrawListenerField.isAccessible = true
-      val preDrawListener = preDrawListenerField.get(baseBlurViewGroup)
-        as? ViewTreeObserver.OnPreDrawListener
-
-      if (oldDecorView != null && preDrawListener != null) {
-        // Remove listener from old root
-        oldDecorView.viewTreeObserver.removeOnPreDrawListener(preDrawListener)
+  // ── Draw ───────────────────────────────────────────────────────────────────
 
-        // Set new root
-        decorViewField.set(baseBlurViewGroup, newRoot)
-
-        // Wrap in Choreographer gate: fires at most once per vsync regardless of
-        // how many child invalidations happen in the same frame
-        val gatedListener = ViewTreeObserver.OnPreDrawListener {
-          if (!frameScheduled) {
-            frameScheduled = true
-            android.view.Choreographer.getInstance().postFrameCallback(frameCallback)
-          }
-          true  // never block the draw pass
-        }
-
-        // Add gated listener to new root (NOT the original raw listener)
-        newRoot.viewTreeObserver.addOnPreDrawListener(gatedListener)
+  override fun onDraw(canvas: Canvas) {
+    blurController?.draw(canvas, width.toFloat(), height.toFloat())
+  }
 
-        // Update mDifferentRoot flag
-        val differentRootField = baseClass.getDeclaredField("mDifferentRoot")
-        differentRootField.isAccessible = true
-        differentRootField.setBoolean(baseBlurViewGroup, newRoot.rootView != this.rootView)
+  // ── Public setters ─────────────────────────────────────────────────────────
 
-        // Force redraw
-        val forceRedrawField = baseClass.getDeclaredField("mForceRedraw")
-        forceRedrawField.isAccessible = true
-        forceRedrawField.setBoolean(baseBlurViewGroup, true)
-      }
-    } catch (e: Exception) {
-      // Reflection failed — QmBlurView internals changed
-      // Fall back gracefully to default decor view blur root
-    }
+  fun setBlurAmount(amount: Float) {
+    pendingBlurAmount = amount
+    blurController?.blurRadius = mapBlurAmount(amount)
   }
 
-  private fun findNearestScreenAncestor(): ViewGroup? {
-    var current = parent
-    while (current != null) {
-      if (current.javaClass.name == "com.swmansion.rnscreens.Screen") {
-        return current as? ViewGroup
-      }
-      current = current.parent
-    }
-    return null
+  fun setOverlayColor(colorString: String?) {
+    pendingOverlay = parseHexColor(colorString ?: "transparent") ?: Color.TRANSPARENT
+    blurController?.overlayColor = pendingOverlay
+    invalidate()
   }
 
-  private fun findNearestReactRootView(): ViewGroup? {
-    var current = parent
-    while (current != null) {
-      if (current.javaClass.name == "com.facebook.react.ReactRootView") {
-        return current as? ViewGroup
-      }
-      current = current.parent
-    }
-    return null
+  fun setBlurRadius(factor: Int) {
+    // No-op for now — LegacyBlurController uses fixed DOWNSAMPLE_FACTOR = 4
+    // Could expose downsampleFactor setter on controller if needed
   }
 
-  private fun initializeBlur() {
-    if (isBlurInitialized) return
-    try {
-      super.setBlurRadius(currentBlurRadius)
-      super.setOverlayColor(currentOverlayColor)
-      updateCornerRadius()
-      isBlurInitialized = true
-    } catch (e: Exception) {
-      // Ignore — view may not be fully attached yet
+  fun applyBorderRadius(radiusDp: Float) {
+    cornerRadiusPx = TypedValue.applyDimension(
+      TypedValue.COMPLEX_UNIT_DIP, radiusDp, context.resources.displayMetrics
+    )
+    outlineProvider = object : ViewOutlineProvider() {
+      override fun getOutline(view: View, outline: Outline) {
+        outline.setRoundRect(0, 0, view.width, view.height, cornerRadiusPx)
+      }
     }
+    clipToOutline = cornerRadiusPx > 0f
+    invalidate()
   }
 
-  // MARK: - Public setters
+  fun setReducedTransparencyFallbackColor(@Suppress("UNUSED_PARAMETER") color: String?) { }
 
-  fun setBlurAmount(amount: Float) {
-    currentBlurRadius = mapBlurAmountToRadius(amount)
-    try { super.setBlurRadius(currentBlurRadius) } catch (e: Exception) {}
+  fun applyBlurEnabled(enabled: Boolean) {
+    blurController?.enabled = enabled
+    if (!enabled) invalidate()
   }
 
-  fun setOverlayColor(colorString: String?) {
-    currentOverlayColor = parseHexColor(colorString ?: "transparent") ?: Color.TRANSPARENT
-    try {
-      super.setBackgroundColor(currentOverlayColor)
-      super.setOverlayColor(currentOverlayColor)
-    } catch (e: Exception) {}
+  fun setAutoUpdate(autoUpdate: Boolean) {
+    blurController?.autoUpdate = autoUpdate
   }
 
-  fun setReducedTransparencyFallbackColor(colorString: String?) {
-    // Stored for future use — QmBlurView handles accessibility fallback internally
-  }
+  // ── Layout passthrough ─────────────────────────────────────────────────────
 
-  fun setBlurRadius(radius: Int) {
-    // blurRadius is the Android downscale factor — map to QmBlurView's downsample factor
-    val downsample = radius.coerceIn(1, 8).toFloat()
-    try { super.setDownsampleFactor(downsample) } catch (e: Exception) {}
+  override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int) {
+    // Yoga handles all layout
   }
 
-  fun setBorderRadius(radius: Float) {
-    currentCornerRadius = radius
-    updateCornerRadius()
-  }
+  // ── Helpers ────────────────────────────────────────────────────────────────
 
-  private fun updateCornerRadius() {
-    val radiusPx = TypedValue.applyDimension(
-      TypedValue.COMPLEX_UNIT_DIP,
-      currentCornerRadius,
-      context.resources.displayMetrics
-    )
-    outlineProvider = object : ViewOutlineProvider() {
-      override fun getOutline(view: View, outline: Outline) {
-        outline.setRoundRect(0, 0, view.width, view.height, radiusPx)
-      }
-    }
-    clipToOutline = true
-    try { super.setCornerRadius(radiusPx) } catch (e: Exception) {}
+  private fun mapBlurAmount(amount: Float): Float {
+    val t = amount.coerceIn(0f, 100f) / 100f
+    return t * t * 25f  // quadratic curve, max 25 (RenderScript kernel limit)
   }
 
-  // React Native handles layout — prevent superclass from interfering
-  override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int) {
-    // No-op: layout handled by React Native's Yoga engine
+  private fun findBlurRoot(): ViewGroup? {
+    var p = parent
+    while (p != null) {
+      if ((p as? View)?.javaClass?.name == "com.swmansion.rnscreens.Screen") return p as? ViewGroup
+      p = (p as? View)?.parent
+    }
+    p = parent
+    while (p != null) {
+      if ((p as? View)?.javaClass?.name == "com.facebook.react.ReactRootView") return p as? ViewGroup
+      p = (p as? View)?.parent
+    }
+    return rootView as? ViewGroup
   }
 
-  // MARK: - Color parser
-  // Supports: "transparent", "#RGB", "#RRGGBB", "#RRGGBBAA"
-  private fun parseHexColor(colorString: String): Int? {
-    val s = colorString.trim()
-    if (s.equals("transparent", ignoreCase = true)) return Color.TRANSPARENT
-    if (!s.startsWith("#")) {
-      return try { s.toColorInt() } catch (e: Exception) { null }
-    }
-    val hex = s.removePrefix("#")
+  private fun parseHexColor(s: String): Int? {
+    val t = s.trim()
+    if (t.equals("transparent", ignoreCase = true)) return Color.TRANSPARENT
+    if (!t.startsWith("#")) return try { t.toColorInt() } catch (_: Exception) { null }
+    val hex = t.removePrefix("#")
     return try {
       when (hex.length) {
-        3 -> Color.argb(
-          255,
-          hex[0].toString().repeat(2).toInt(16),
-          hex[1].toString().repeat(2).toInt(16),
-          hex[2].toString().repeat(2).toInt(16)
-        )
-        6 -> Color.argb(
-          255,
-          hex.substring(0, 2).toInt(16),
-          hex.substring(2, 4).toInt(16),
-          hex.substring(4, 6).toInt(16)
-        )
-        8 -> Color.argb(
-          hex.substring(6, 8).toInt(16), // AA is last in #RRGGBBAA
-          hex.substring(0, 2).toInt(16),
-          hex.substring(2, 4).toInt(16),
-          hex.substring(4, 6).toInt(16)
-        )
+        3 -> Color.argb(255, hex[0].toString().repeat(2).toInt(16),
+                             hex[1].toString().repeat(2).toInt(16),
+                             hex[2].toString().repeat(2).toInt(16))
+        6 -> Color.argb(255, hex.substring(0,2).toInt(16),
+                             hex.substring(2,4).toInt(16),
+                             hex.substring(4,6).toInt(16))
+        8 -> Color.argb(hex.substring(6,8).toInt(16),
+                        hex.substring(0,2).toInt(16),
+                        hex.substring(2,4).toInt(16),
+                        hex.substring(4,6).toInt(16))
         else -> null
       }
-    } catch (e: NumberFormatException) { null }
+    } catch (_: NumberFormatException) { null }
   }
 }