feat(android): add blur rounds support#104
Merged
Merged
Conversation
DanielAraldi
added
documentation
📝 WalkthroughWalkthroughAdds an Android-facing ChangesblurRounds Prop Addition
Sequence Diagram(s)sequenceDiagram
participant JS as React (JS)
participant CG as Codegen Native Component
participant RM as Manager (ReactProp)
participant AV as Android View
participant BL as Blur Engine
JS->>CG: render native component with prop blurRounds
CG->>RM: codegen forwards prop to manager setter
RM->>AV: call setRounds(blurRounds)
AV->>AV: clamp to 1..15, update currentBlurRounds
AV->>BL: apply blurRounds to native blur implementation
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Tip 💬 Introducing Slack Agent: The best way for teams to turn conversations into code.Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.
Built for teams:
One agent for your entire SDLC. Right inside Slack. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In
`@android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitch.kt`:
- Around line 175-188: The setRounds method currently calls super.setBlurRounds
but does not store the chosen value, so if the parent resets state on reattach
the custom value is lost; add a private backing field (e.g., private var
cachedBlurRounds = 5) in ReactNativeBlurSwitch, update cachedBlurRounds inside
setRounds before calling super.setBlurRounds, and ensure initializeSwitch()
and/or onAttachedToWindow() re-applies cachedBlurRounds by calling
super.setBlurRounds(cachedBlurRounds) so the value survives reattachments.
In `@android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurView.kt`:
- Around line 273-286: The setter setRounds currently computes blurRounds but
doesn't persist it, so add a backing field (e.g., currentBlurRounds: Int) to
store the coerced value and update it inside setRounds; then modify
initializeBlur() to re-apply the stored value by calling
super.setBlurRounds(currentBlurRounds) (ensuring you coerceIn(1,15) when
assigning/using it). Also ensure currentBlurRounds has a sensible default that
matches QmBlurView's default so re-attaches preserve expected behavior.
In `@README.md`:
- Line 629: The README props tables are missing the platform qualifier for the
blurRounds prop; update the description for the blurRounds property in the
BlurView, ProgressiveBlurView, and BlurSwitch props tables to append " (Android
only)" so it matches the TSDoc/@platform and the other platform qualifiers
(e.g., blurAmount and ignoreSafeArea), ensuring the blurRounds entries now read
like "The number of blur interactions must be an integer value (1-15) (Android
only)".
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: fa7c65d8-ede4-4576-91e1-90854f80aab1
📒 Files selected for processing (14)
README.mdandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitch.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitchManager.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurView.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurViewManager.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeProgressiveBlurView.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeProgressiveBlurViewManager.ktexample/package.jsonsrc/BlurSwitch.tsxsrc/BlurView.tsxsrc/ProgressiveBlurView.tsxsrc/ReactNativeBlurSwitchNativeComponent.tssrc/ReactNativeBlurViewNativeComponent.tssrc/ReactNativeProgressiveBlurViewNativeComponent.ts
Owner
|
Hey @DanielAraldi, small conflict after i merged the dark mode one |
Collaborator
Author
Fixed 😅 |
Owner
|
Sorry for being picky, can you do a rebase not a merge :( we always merge with a rebase and it wont be possible if you do merge |
Collaborator
Author
|
No problem my friend! 🫡 |
Owner
You are the 🐐 |
There was a problem hiding this comment.
♻️ Duplicate comments (1)
android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurView.kt (1)
94-99:⚠️ Potential issue | 🟠 Major | ⚡ Quick winRe-apply
currentBlurRoundsduring initialization.
setupView()seeds the value, butinitializeBlur()still rehydrates only radius, overlay, and corner radius. If QmBlurView resets rounds on attach, this prop will be lost again after a detach/reattach cycle. Please verify that behavior against QmBlurView 1.1.4 and, if needed, restore the cached rounds here as well.🔧 Suggested fix
private fun initializeBlur() { if (isBlurInitialized) return try { super.setBlurRadius(currentBlurRadius) super.setOverlayColor(currentOverlayColor) + super.setBlurRounds(currentBlurRounds) updateCornerRadius() isBlurInitialized = trueAlso applies to: 244-251
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurView.kt` around lines 94 - 99, The setupView() currently seeds blurRounds with currentBlurRounds but initializeBlur() only rehydrates radius, overlay and cornerRadius, so blurRounds can be reset on attach/reattach by QmBlurView; update initializeBlur() (or the attach path where QmBlurView resets state) to explicitly restore blurRounds = currentBlurRounds (or call setupView()’s rounds logic) and ensure you reference the currentBlurRounds field when reapplying props so the cached rounds persist across detach/reattach cycles (verify behavior against QmBlurView 1.1.4 and mirror its rehydration order).
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Duplicate comments:
In `@android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurView.kt`:
- Around line 94-99: The setupView() currently seeds blurRounds with
currentBlurRounds but initializeBlur() only rehydrates radius, overlay and
cornerRadius, so blurRounds can be reset on attach/reattach by QmBlurView;
update initializeBlur() (or the attach path where QmBlurView resets state) to
explicitly restore blurRounds = currentBlurRounds (or call setupView()’s rounds
logic) and ensure you reference the currentBlurRounds field when reapplying
props so the cached rounds persist across detach/reattach cycles (verify
behavior against QmBlurView 1.1.4 and mirror its rehydration order).
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: d3b8a1c4-c8f8-42ff-bd01-0bcd79af4116
📒 Files selected for processing (6)
android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitch.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurView.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeProgressiveBlurView.ktsrc/BlurView.tsxsrc/ProgressiveBlurView.tsxsrc/ReactNativeBlurSwitchNativeComponent.ts
✅ Files skipped from review due to trivial changes (1)
- src/ReactNativeBlurSwitchNativeComponent.ts
🚧 Files skipped from review as they are similar to previous changes (2)
- android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitch.kt
- android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeProgressiveBlurView.kt
Collaborator
Author
|
Hey @sbaiahmed1, will I have to revert the merge? Do a revert? Or just do a git fetch on the origin and then a rebase? I'm a little confused haha 🤣 |
Owner
|
Hahaha @DanielAraldi dont worry |
sbaiahmed1
force-pushed
the
feat/add-blur-rounds-android
branch
from
c2ba382 to
756e924
Compare
sbaiahmed1
force-pushed
the
feat/add-blur-rounds-android
branch
from
756e924 to
91af23e
Compare
There was a problem hiding this comment.
♻️ Duplicate comments (1)
android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurView.kt (1)
244-257:⚠️ Potential issue | 🟠 Major | ⚡ Quick win
initializeBlur()still does not re-applycurrentBlurRoundson reattachThe backing field
currentBlurRoundsand the correct update insetRounds()(lines 299-301) address part of the previous review, butinitializeBlur()— the only recovery point after a detach→reattach cycle — still does not callsuper.setBlurRounds(currentBlurRounds). Becausecleanup()resetsisBlurInitialized = false, every navigation detach/reattach will runinitializeBlur()again and leaveblurRoundsat whatever QmBlurView's internal default is, silently discarding the configured prop value.setupView()only runs in the constructor and does not help here.🛡️ Proposed fix
private fun initializeBlur() { if (isBlurInitialized) return try { super.setBlurRadius(currentBlurRadius) super.setOverlayColor(currentOverlayColor) updateCornerRadius() + super.setBlurRounds(currentBlurRounds) isBlurInitialized = true logDebug("QmBlurView initialized with blurRadius: $currentBlurRadius, overlayColor: $currentOverlayColor") } catch (e: Exception) { logError("Failed to initialize blur view: ${e.message}", e) } }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurView.kt` around lines 244 - 257, initializeBlur() doesn't re-apply the backing field currentBlurRounds after a detach→reattach, so blurRounds falls back to the QmBlurView default; modify initializeBlur() to call super.setBlurRounds(currentBlurRounds) (similar to setRounds()) before marking isBlurInitialized = true so the stored rounds value is restored after cleanup()/reattach.
🧹 Nitpick comments (1)
android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitchManager.kt (1)
43-46: ⚡ Quick winAdd
defaultInt = 5to@ReactPropto align with the documented default.When a prop that was previously set is subsequently removed (old architecture / Paper), React Native calls the setter with the
@ReactPropdefault. WithoutdefaultInt, the implicit default is0, sosetRounds(0)is called instead ofsetRounds(5). The native clamp would floor this to1rather than the intended5. CompareblurAmount's@ReactProp(name = "blurAmount", defaultDouble = 10.0)pattern on Line 38.🛠️ Proposed fix
- `@ReactProp`(name = "blurRounds") + `@ReactProp`(name = "blurRounds", defaultInt = 5) fun setBlurRounds(view: ReactNativeBlurSwitch?, blurRounds: Int) { view?.setRounds(blurRounds) }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitchManager.kt` around lines 43 - 46, The `@ReactProp` annotation on setBlurRounds currently has no default so removed props become 0; update the annotation on the setBlurRounds method to include defaultInt = 5 (matching the documented default and the pattern used for blurAmount) so that when React passes the default the view?.setRounds(blurRounds) call receives 5 instead of 0; locate ReactProp, setBlurRounds, and the setRounds call to make this change.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Duplicate comments:
In `@android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurView.kt`:
- Around line 244-257: initializeBlur() doesn't re-apply the backing field
currentBlurRounds after a detach→reattach, so blurRounds falls back to the
QmBlurView default; modify initializeBlur() to call
super.setBlurRounds(currentBlurRounds) (similar to setRounds()) before marking
isBlurInitialized = true so the stored rounds value is restored after
cleanup()/reattach.
---
Nitpick comments:
In
`@android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitchManager.kt`:
- Around line 43-46: The `@ReactProp` annotation on setBlurRounds currently has no
default so removed props become 0; update the annotation on the setBlurRounds
method to include defaultInt = 5 (matching the documented default and the
pattern used for blurAmount) so that when React passes the default the
view?.setRounds(blurRounds) call receives 5 instead of 0; locate ReactProp,
setBlurRounds, and the setRounds call to make this change.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: fcdc85fd-49d1-4158-88f3-e85115d0dd10
📒 Files selected for processing (14)
README.mdandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitch.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitchManager.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurView.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurViewManager.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeProgressiveBlurView.ktandroid/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeProgressiveBlurViewManager.ktexample/package.jsonsrc/BlurSwitch.tsxsrc/BlurView.tsxsrc/ProgressiveBlurView.tsxsrc/ReactNativeBlurSwitchNativeComponent.tssrc/ReactNativeBlurViewNativeComponent.tssrc/ReactNativeProgressiveBlurViewNativeComponent.ts
✅ Files skipped from review due to trivial changes (3)
- example/package.json
- src/BlurView.tsx
- README.md
🚧 Files skipped from review as they are similar to previous changes (6)
- src/ReactNativeBlurViewNativeComponent.ts
- android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurViewManager.kt
- android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeProgressiveBlurView.kt
- android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeBlurSwitch.kt
- src/ReactNativeBlurSwitchNativeComponent.ts
- android/src/main/java/com/sbaiahmed1/reactnativeblur/ReactNativeProgressiveBlurViewManager.kt
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Requested by @nexquery
Comment link: #100 (comment)
Add support for blur rounds in Android only. This property controls blur interactions during blur draw.
Depends on:
Summary by CodeRabbit
New Features
Documentation