ReactNativeEffectsView
Component to make easy use of iOS8
UIVisualEffectViews
withUIBlurEffect
andUIVibrancyEffect
in ReactNative.
Install
npm install react-native-effects-view --save
- In XCode right click on project's name and choose
Add Files to..
- Go to
node_modules/react-native-effects-view
and selectDVEffects
folder - Now you're ready to
require('react-native-effects-view')
inside your app!
Props
blurStyle
(String) - choose one of the following:"light"
(default)"extraLight"
"dark"
vibrantContent
(ReactElement) - render vibrant content inside blurred view.
Children
All children of <EffectsView />
will be blurred, however you can use it without children and position element on top of background images and other views.
Example
In order to see usage example check example/EffectsApp
folder in XCode (don't forget to run npm install
inside). It contains the app presented by screenshot.
var React = ;var EffectsView = ;var AppRegistry StyleSheet View = React; var App = React
References
Demo app is inspired by UIVisualEffects repo.
MIT Licensed