ReactNative: how to center text?

How to center Text in ReactNative both in horizontal and vertical?

I have an example application in rnplay.org where justifyContent="center" and alignItems="center" is not working:
https://rnplay.org/apps/AoxNKQ

The text should being centered.
And why is there a margin at the top between the text (yellow) and parent container?

Code:
'use strict';

var React = require('react-native');
var {
AppRegistry,
StyleSheet,
Text,
Image,
View,
} = React;

var SampleApp = React.createClass({
render: function() {
return (



lorem ipsum{'\n'}
ipsum lorem lorem





);
}
});

var styles = StyleSheet.create({
container: {
flex: 1,
flexDirection: 'column',
backgroundColor: 'red',
justifyContent: 'center',
alignItems: 'center',
},
topBox: {
flex: 1,
flexDirection: 'row',
backgroundColor: 'lightgray',
justifyContent: 'center',
alignItems: 'center',
},
headline: {
fontWeight: 'bold',
fontSize: 18,
marginTop: 0,
width: 200,
height: 80,
backgroundColor: 'yellow',
justifyContent: 'center',
alignItems: 'center',
},
otherContainer: {
flex: 4,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: 'green',
},
});

AppRegistry.registerComponent('SampleApp', () => SampleApp);

module.exports = SampleApp;


From headline' style remove height, justifyContent and alignItems. It will center the text vertically. Add textAlign: 'center' and it will center the text horizontally.



` headline: {
textAlign: 'center', //

Stack Overflow Q#37571418, score: 535