Fix multiple blur view issues #411

ja-ka · 2021-02-27T06:49:11Z

Dimezis just released a fix with Dimezis/BlurView#110 to address app crashes on Android when multiple blur views are in place. This PR includes the most recent version from https://github.com/Dimezis/BlurView into this project.

flyingSAP · 2021-03-02T11:13:08Z

Hi @Kureev can this be merged?

zmtmaster · 2021-03-03T10:30:55Z

Issue seems to be using two BlurView components, This PR uses the lasted update from https://github.com/Dimezis/BlurView which solves the issue,

See Dimezis/BlurView#110 (comment)

Used this fix with patch-package it does work, so until this will be merged here's patch file if anyone need it.

diff --git a/node_modules/@react-native-community/blur/android/build.gradle b/node_modules/@react-native-community/blur/android/build.gradle
index 8177235..b401cb8 100644
--- a/node_modules/@react-native-community/blur/android/build.gradle
+++ b/node_modules/@react-native-community/blur/android/build.gradle
@@ -43,5 +43,5 @@ repositories {
 dependencies {
     //noinspection GradleDynamicVersion
     implementation 'com.facebook.react:react-native:+'
-    implementation 'com.eightbitlab:blurview:1.6.3'
+    implementation 'com.eightbitlab:blurview:1.6.6'
 }

tsdmrfth · 2021-03-03T12:55:04Z

@zmtmaster Thanks for the patch. It works!

nhannah · 2021-03-04T00:18:58Z

Thanks for putting up the PR hopefully they merge it soon!

lakhvirk · 2021-03-06T12:32:44Z

Please merge it soon as this issue ruins my whole week to figure out where is the issue 😢
I finished my project by testing app on iOS and it was working fine but when I tested on android, i saw my app getting freezes 🥶 and slow..
It took me so long to figure out this..
Please save someone’s life like me 👍 who might be struggling somewhere else 😃

coding-st · 2021-03-09T10:32:36Z

@zmtmaster thanks for the fix. Can you give a little more detailed description how to perform the fix with patch-package. I never used patch-package before & don't know what to do exactly.

Big thanks in advance.

zmtmaster · 2021-03-09T18:38:14Z

@zmtmaster thanks for the fix. Can you give a little more detailed description how to perform the fix with patch-package. I never used patch-package before & don't know what to do exactly.

Big thanks in advance.

patch-package is a NPM module that allows you to change a node_module files (ie dependents, source files, type file etc') and by creating a diff file (patch file) it can keep the changes made for the whole team to be sync, it is great for use cases like this bug we are facing that we need to keep the module working but we can not wait for the PR to be merged.

you can read more about it here https://www.npmjs.com/package/patch-package

C-odes · 2021-03-11T14:57:08Z

Issue seems to be using two BlurView components, This PR uses the lasted update from https://github.com/Dimezis/BlurView which solves the issue,

See Dimezis/BlurView#110 (comment)

Used this fix with patch-package it does work, so until this will be merged here's patch file if anyone need it.
diff --git a/node_modules/@react-native-community/blur/android/build.gradle b/node_modules/@react-native-community/blur/android/build.gradle
index 8177235..b401cb8 100644
--- a/node_modules/@react-native-community/blur/android/build.gradle
+++ b/node_modules/@react-native-community/blur/android/build.gradle
@@ -43,5 +43,5 @@ repositories {
 dependencies {
     //noinspection GradleDynamicVersion
     implementation 'com.facebook.react:react-native:+'
-    implementation 'com.eightbitlab:blurview:1.6.3'
+    implementation 'com.eightbitlab:blurview:1.6.6'
 }

So I'm new to react native.. how do I add this as it's not merged yet? I understand you use patch-package but if you could give more pointers on what steps are needed.

Do I just add a file with that content and run patch-package command withotu arguments? If so where do I add the file?

Watched a tutorial and found out I believe. Placed the edit in and gona test it. Should it work I'll make it with patch-package so the change doesnt get whiped out until the merge comes.

kevinvangelder · 2021-03-15T22:59:37Z

@C-odes You put that snippet into a file at patches/@react-native-community+blur+3.6.0.patch and then, if you have patch-package correctly configured it will apply the patch after every yarn/npm install.

C-odes · 2021-03-30T20:06:32Z

@C-odes You put that snippet into a file at patches/@react-native-community+blur+3.6.0.patch and then, if you have patch-package correctly configured it will apply the patch after every yarn/npm install.

Applied the fix and patch-package. IT seemed to work but when I deleted node modules and ran yarn install. It didnt apply the patch... odd.

IS there more than just applying the change, run patch-package to create the "patches" folder with the changes in it?

RodolfoGS · 2021-03-30T20:10:18Z

@C-odes You put that snippet into a file at patches/@react-native-community+blur+3.6.0.patch and then, if you have patch-package correctly configured it will apply the patch after every yarn/npm install.

Applied the fix and patch-package. IT seemed to work but when I deleted node modules and ran yarn install. It didnt apply the patch... odd.

IS there more than just applying the change, run patch-package to create the "patches" folder with the changes in it?

You need to add "postinstall": "patch-package" to your package.json and install with npm i patch-package
Follow the setup: https://github.com/ds300/patch-package#set-up

seancheung · 2021-04-13T03:05:15Z

Issue seems to be using two BlurView components, This PR uses the lasted update from https://github.com/Dimezis/BlurView which solves the issue,

See Dimezis/BlurView#110 (comment)

Used this fix with patch-package it does work, so until this will be merged here's patch file if anyone need it.
diff --git a/node_modules/@react-native-community/blur/android/build.gradle b/node_modules/@react-native-community/blur/android/build.gradle
index 8177235..b401cb8 100644
--- a/node_modules/@react-native-community/blur/android/build.gradle
+++ b/node_modules/@react-native-community/blur/android/build.gradle
@@ -43,5 +43,5 @@ repositories {
 dependencies {
     //noinspection GradleDynamicVersion
     implementation 'com.facebook.react:react-native:+'
-    implementation 'com.eightbitlab:blurview:1.6.3'
+    implementation 'com.eightbitlab:blurview:1.6.6'
 }

You don't need to do that. Just force the dependency version in your android/app/build.gradle:

dependencies {
    implementation('com.eightbitlab:blurview:1.6.6') {
        force = true
    }
}

bouteillerAlan

work for me too

need this mr asap, this is annoying behavior while this package is useful ^^

Kureev · 2021-04-26T22:29:18Z

Hi folks! Thanks for submitting a pull request, but this library is no longer maintained. Please, consider using a community fork: @react-native-community/blur

sonicdoe · 2021-04-28T08:03:24Z

Isn’t this @react-native-community/blur? The package.json contains @react-native-community/blur and react-native-community/react-native-blur redirects to this repository.

C-odes · 2021-04-28T09:11:58Z

Isn’t this @react-native-community/blur? The package.json contains @react-native-community/blur and react-native-community/react-native-blur redirects to this repository.

Yes? It is @react-native-community/blur

jaquinocode · 2021-07-12T02:01:44Z

Isn’t this @react-native-community/blur? The package.json contains @react-native-community/blur and react-native-community/react-native-blur redirects to this repository.

@Kureev Can you respond to this? Why are you the owner of a community repo but you say you're not? It's concerning. Some clarity would be great, thanks. 🙂

For reference, this is what you said:

Hi folks! Thanks for submitting a pull request, but this library is no longer maintained. Please, consider using a community fork: @react-native-community/blur

thiago-sants · 2021-07-13T20:56:02Z

I'm having this problem too. Seems like it won't be fixed any time soon. And I didn't find other options. If anyone has an alternative, I would be really grateful.

Edit: I found a way to resolve this: disable React Navigation animation on screens that uses BlurView. It's the only way that I found to resolve this problem without excluding BlurView from the app. I got this solution from this comment.

chenop · 2021-08-23T12:13:08Z

Issue seems to be using two BlurView components, This PR uses the lasted update from https://github.com/Dimezis/BlurView which solves the issue,
See Dimezis/BlurView#110 (comment)
Used this fix with patch-package it does work, so until this will be merged here's patch file if anyone need it.
diff --git a/node_modules/@react-native-community/blur/android/build.gradle b/node_modules/@react-native-community/blur/android/build.gradle
index 8177235..b401cb8 100644
--- a/node_modules/@react-native-community/blur/android/build.gradle
+++ b/node_modules/@react-native-community/blur/android/build.gradle
@@ -43,5 +43,5 @@ repositories {
 dependencies {
     //noinspection GradleDynamicVersion
     implementation 'com.facebook.react:react-native:+'
-    implementation 'com.eightbitlab:blurview:1.6.3'
+    implementation 'com.eightbitlab:blurview:1.6.6'
 }
You don't need to do that. Just force the dependency version in your android/app/build.gradle:
dependencies {
    implementation('com.eightbitlab:blurview:1.6.6') {
        force = true
    }
}

Adding

implementation('com.eightbitlab:blurview:1.6.6') {
         force = true
}

Worked for me - @seancheung can you please explain why is it fixing the issue?

chenop · 2021-08-23T12:54:49Z

Another way to resolve that is using the latest tagged version "3.6.1":
"@react-native-community/blur": "https://github.com/Kureev/react-native-blur#3.6.1",

Its include:

implementation('com.eightbitlab:blurview:1.6.6') {
         force = true
}

Its a shame it was not released...

Lexical-Luke · 2021-08-24T15:43:51Z

@chenop how exactly do I apply that?

When I add that to my package.json and npm install I get the error "error: pathspec '3.6.1' did not match any file(s) known to git", I really need this fix as of course, this issue is still present.

chenop · 2021-08-24T17:39:05Z

@Lexical-Luke nothing special - like you wrote

Add to package.json:
"@react-native-community/blur": "https://github.com/Kureev/react-native-blur#3.6.1",
npm install

alexanderblackh · 2021-10-30T02:50:22Z

Anyone know how to fix this with iOS? Running 3.6.0, yarn says there is no 3.6.1.

sayurimizuguchi · 2022-01-07T15:25:34Z

Any timeline when we're going to release/publish 3.6.1?

mjm918 · 2022-04-30T09:49:03Z

this issue still happening in 3.6.1

premhowli-buyhatke · 2023-06-12T05:53:04Z

I am using version 4.3.2 and still see the same issue. do I need to patch com.eightbitlab:blurview:1.6.6 or is there any new version available? also where is this hosted. build system could not find this in google as well as mavencentral.

Fix multiple blur view issues

5bf427b

ja-ka mentioned this pull request Feb 27, 2021

Can't use multiple BlurView on Android #396

Open

RodolfoGS approved these changes Mar 26, 2021

View reviewed changes

Gabrielfcs approved these changes Mar 30, 2021

View reviewed changes

RodolfoGS mentioned this pull request Mar 30, 2021

Android crash #405

Open

clegirar mentioned this pull request Apr 4, 2021

BlurView Bug Android berty/berty#3221

Closed

bouteillerAlan approved these changes Apr 20, 2021

View reviewed changes

Kureev approved these changes Apr 26, 2021

View reviewed changes

Kureev merged commit 70c7d2c into Kureev:master Apr 26, 2021

Ceredavide mentioned this pull request Jun 6, 2021

Just hard-crashes on Android without any error info #368

Open

Parveshdhull mentioned this pull request Jul 13, 2022

Implementation of React Native Blur view for android status-im/status-mobile#13663

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix multiple blur view issues #411

Fix multiple blur view issues #411

ja-ka commented Feb 27, 2021

flyingSAP commented Mar 2, 2021

zmtmaster commented Mar 3, 2021 •

edited

Loading

tsdmrfth commented Mar 3, 2021

nhannah commented Mar 4, 2021

lakhvirk commented Mar 6, 2021

coding-st commented Mar 9, 2021

zmtmaster commented Mar 9, 2021

C-odes commented Mar 11, 2021 •

edited

Loading

kevinvangelder commented Mar 15, 2021

C-odes commented Mar 30, 2021

RodolfoGS commented Mar 30, 2021

seancheung commented Apr 13, 2021 •

edited

Loading

bouteillerAlan left a comment •

edited

Loading

Kureev commented Apr 26, 2021

sonicdoe commented Apr 28, 2021

C-odes commented Apr 28, 2021

jaquinocode commented Jul 12, 2021 •

edited

Loading

thiago-sants commented Jul 13, 2021 •

edited

Loading

chenop commented Aug 23, 2021 •

edited

Loading

chenop commented Aug 23, 2021

Lexical-Luke commented Aug 24, 2021

chenop commented Aug 24, 2021

alexanderblackh commented Oct 30, 2021

sayurimizuguchi commented Jan 7, 2022

mjm918 commented Apr 30, 2022

premhowli-buyhatke commented Jun 12, 2023 •

edited

Loading

Fix multiple blur view issues #411

Fix multiple blur view issues #411

Conversation

ja-ka commented Feb 27, 2021

flyingSAP commented Mar 2, 2021

zmtmaster commented Mar 3, 2021 • edited Loading

tsdmrfth commented Mar 3, 2021

nhannah commented Mar 4, 2021

lakhvirk commented Mar 6, 2021

coding-st commented Mar 9, 2021

zmtmaster commented Mar 9, 2021

C-odes commented Mar 11, 2021 • edited Loading

kevinvangelder commented Mar 15, 2021

C-odes commented Mar 30, 2021

RodolfoGS commented Mar 30, 2021

seancheung commented Apr 13, 2021 • edited Loading

bouteillerAlan left a comment • edited Loading

Choose a reason for hiding this comment

Kureev commented Apr 26, 2021

sonicdoe commented Apr 28, 2021

C-odes commented Apr 28, 2021

jaquinocode commented Jul 12, 2021 • edited Loading

thiago-sants commented Jul 13, 2021 • edited Loading

chenop commented Aug 23, 2021 • edited Loading

chenop commented Aug 23, 2021

Lexical-Luke commented Aug 24, 2021

chenop commented Aug 24, 2021

alexanderblackh commented Oct 30, 2021

sayurimizuguchi commented Jan 7, 2022

mjm918 commented Apr 30, 2022

premhowli-buyhatke commented Jun 12, 2023 • edited Loading

zmtmaster commented Mar 3, 2021 •

edited

Loading

C-odes commented Mar 11, 2021 •

edited

Loading

seancheung commented Apr 13, 2021 •

edited

Loading

bouteillerAlan left a comment •

edited

Loading

jaquinocode commented Jul 12, 2021 •

edited

Loading

thiago-sants commented Jul 13, 2021 •

edited

Loading

chenop commented Aug 23, 2021 •

edited

Loading

premhowli-buyhatke commented Jun 12, 2023 •

edited

Loading