Created
December 15, 2015 19:20
-
-
Save frantic/741a824879e34c1ad375 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Sample React Native App | |
* https://github.com/facebook/react-native | |
*/ | |
'use strict'; | |
var React = require('react-native'); | |
var { | |
AppRegistry, | |
StyleSheet, | |
Text, | |
View, | |
} = React; | |
var LinearGradient = require('react-native-linear-gradient'); | |
var GradientBug = React.createClass({ | |
render: function() { | |
return ( | |
<View style={styles.container}> | |
<LinearGradient | |
start={[0.5, 1]} end={[1, 1]} | |
colors={['#6A6AD5', '#6F86D9']} | |
style={styles.button}> | |
<Text style={styles.caption}> | |
BLUE BUTTON | |
</Text> | |
</LinearGradient> | |
<LinearGradient | |
start={[0.5, 1]} end={[1, 1]} | |
colors={['#39AAB9', '#9ACEA4']} | |
style={styles.button}> | |
<Text style={styles.caption}> | |
GREEN BUTTON | |
</Text> | |
</LinearGradient> | |
</View> | |
); | |
} | |
}); | |
const HEIGHT = 50; | |
var styles = StyleSheet.create({ | |
container: { | |
flex: 1, | |
alignItems: 'center', | |
backgroundColor: '#F5FCFF', | |
}, | |
button: { | |
margin: 40, | |
height: HEIGHT, | |
borderRadius: HEIGHT / 2, | |
alignItems: 'center', | |
justifyContent: 'center', | |
paddingHorizontal: HEIGHT * 0.7, | |
backgroundColor: 'transparent', | |
}, | |
caption: { | |
letterSpacing: 1, | |
fontSize: 12, | |
color: 'white', | |
}, | |
}); | |
AppRegistry.registerComponent('GradientBug', () => GradientBug); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment