Updated example to use ES6 features
Used imports instead of require. Simplified imports and removed unused component View. Background is now a const instead of var. <- ES6 prefers this Removed dangling comma after background ```source={{uri: background, }}``` Generally example is more succinct and easier to understand for users only exposed to the new tools of ES6.
This commit is contained in:
parent
cd10c4d842
commit
47dfe40b6a
|
@ -1,17 +1,11 @@
|
||||||
var React = require('react');
|
import React, {Component} from 'react';
|
||||||
var {
|
import {
|
||||||
Component,
|
|
||||||
PropTypes
|
|
||||||
} = React;
|
|
||||||
|
|
||||||
var ReactNative = require('react-native');
|
|
||||||
var {
|
|
||||||
AppRegistry,
|
AppRegistry,
|
||||||
StyleSheet,
|
StyleSheet,
|
||||||
Text,
|
Text,
|
||||||
View,
|
|
||||||
Image,
|
Image,
|
||||||
} = ReactNative;
|
} from 'react-native';
|
||||||
|
import {BlurView, VibrancyView} from 'react-native-blur';
|
||||||
|
|
||||||
const styles = StyleSheet.create({
|
const styles = StyleSheet.create({
|
||||||
container: {
|
container: {
|
||||||
|
@ -27,15 +21,12 @@ const styles = StyleSheet.create({
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
var BlurView = require('react-native-blur').BlurView;
|
const background = 'http://iphonewallpapers-hd.com/thumbs/firework_iphone_wallpaper_5-t2.jpg';
|
||||||
var VibrancyView = require('react-native-blur').VibrancyView;
|
|
||||||
|
|
||||||
var background = 'http://iphonewallpapers-hd.com/thumbs/firework_iphone_wallpaper_5-t2.jpg';
|
|
||||||
|
|
||||||
class Basic extends Component {
|
class Basic extends Component {
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<Image source={{uri: background, }} style={styles.container}>
|
<Image source={{uri: background}} style={styles.container}>
|
||||||
<BlurView blurType="light" style={styles.container}>
|
<BlurView blurType="light" style={styles.container}>
|
||||||
<Text style={styles.welcome}>Blur component</Text>
|
<Text style={styles.welcome}>Blur component</Text>
|
||||||
</BlurView>
|
</BlurView>
|
||||||
|
|
Loading…
Reference in New Issue