Kureev / react-native-blur

React Native Blur component
MIT License
3.76k stars 556 forks source link

Fading in? #29

Closed nc closed 8 years ago

nc commented 8 years ago

Hey,

Awesome work on this.

Tried using Animated with the BlurView but it returns Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

Wrapping in view that animates opacity doesn't work either.

Any suggestions?

Kureev commented 8 years ago

Can you provide an example code?

jevakallio commented 8 years ago

Just a guess, but the error message sounds quite similar as the one you get when you forget to access the .BlurView property of require('react-native-blur') and your local variable ends up pointing to the wrapper object instead.

chanange commented 8 years ago

I got the same error message when I didn't access the .BlurView property too.

var BlurView = require('react-native-blur').BlurView;
Kureev commented 8 years ago

@nc @chanange react-native-blur contain native Obj-C implementation. Are you sure you linked them correct? (see https://github.com/Kureev/react-native-blur#installation)

chanange commented 8 years ago

Yep I linked the RNBlur project and added the libRNBlur.a product to the Build Phases - Link Binary with Libraries.

I got the error message when I imported the module with the following import, as described in the README:

var BlurView = require('react-native-blur')

But accessing with the .BlurView property works.

var BlurView = require('react-native-blur').BlurView
Kureev commented 8 years ago

@chanange In the docs I use

const { BlurView, VibrancyView } = require('react-native-blur');

which is equals to

const BlurView = require('react-native-blur').BlurView;
const VibrancyView = require('react-native-blur').VibrancyView;

so it seems everything is fine.