Add Separator to Text native-base - react-native

Question

I see that there is a Seperator for the List view in native-base like so
import React, { Component } from 'react';
import { Container, Content, ListItem, Text, Separator } from 'native-base';
export default class SeperatorExample extends Component {
render() {
return (
<Container>
<Content>
<Separator bordered>
<Text>FORWARD</Text>
</Separator>
<ListItem >
<Text>Aaron Bennet</Text>
</ListItem>
<ListItem>
<Text>Claire Barclay</Text>
</ListItem>
<ListItem last>
<Text>Kelso Brittany</Text>
</ListItem>
<Separator bordered>
<Text>MIDFIELD</Text>
</Separator>
<ListItem>
<Text>Caroline Aaron</Text>
</ListItem>
</Content>
</Container>
);
}
}
but how would I add in a separator to just a normal text field?
render() {
return (
<Container>
<Content>
<Text>Hello</Text>
</Separator>
<Text>How are you?</Text>
</Content>
</Container>
);
}
as this Separator seems like a List specific piece

Answer 1

You could use your own component to act as a separator.
// separator.js
export default class extends React.component {
render () {
return (
<View style={...this.props.style}>
// If you want children
{ this.props.children }
</View>
)
}
}
// Your other component
import TextSeparator from './separator';
export default class extends React.component {
render () {
return (
<Container>
<Content>
<Text>Hello</Text>
<TextSeparator style={{paddingVertical: 10}} />
<Text>How are you?</Text>
</Content>
</Container>
)
}
}