react native ui component for popular FXBlurView library
Objective-C JavaScript Python Java
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
RCTFXBlurView dynamic prop for auto updates May 23, 2016
example README May 23, 2016
.gitignore Ignore node_modules May 23, 2016
FXBlurView.js dynamic prop for auto updates May 23, 2016
LICENSE Initial commit May 23, 2016
README.md README May 23, 2016
package.json 1.0.2 May 23, 2016

README.md

react-native-fxblurview

<FXBlurView /> provides a [React Native][react-native] component wrapping the native FXBlurView UIView subclass for realtime background blur effect and is compatible with iOS 5 and above.

preview

Table of contents

Setup

rnpm install react-native-fxblurview

Usage

FXBlurView

Provides a React Native component which wraps the FXBlurView.

Defaults
import FXBlurView from 'react-native-fxblurview'

class BlurredView extends Component {
  render() {
    return (
      <FXBlurView>
        { this.props.children }
      </FXBlurView>
    );
  }
}
Fields
Prop Type Opt/Required Default Note
blurEnabled bool Optional true Toggles blurring on and off for an individual FXBlurView instance
blurRadius number Optional 40 Radius of the blur effect (in points). Defaults to a 40 point radius, which is similar to the iOS 7 blur effect
dynamic bool Optional false Controls whether the FXBlurView updates dynamically, or only once when the view is added to its superview

Example

open example/FXBlurViewExample/ios/FXBlurViewExample.xcodeproj

See the example project for a working example.

Contributing

Just submit a pull request!

Contact

Twitter - @imnmj

iamnoah.com

Copyright and license

Code and documentation copyright 2016 Noah. Code released under the MIT license.