Untitled

import React, {Component} from 'react';
import {Platform, StyleSheet, View} from 'react-native';
import { Container, Header, Content, Button, Text, Body, List, ListItem} from 'native-base';
import { createStackNavigator, } from 'react-navigation';
import {HomeScreen} from './screens/HomeScreen';
import {Bluetooth} from './screens/Bluetooth';
import {Paradas} from './screens/Paradas';
import {Horarios} from './screens/Horarios';

const navigation = createStackNavigator({
  HomeScreen:{screen: HomeScreen},
  Bluetooth:{screen: Bluetooth},
  Horarios:{screen: Horarios},
  Paradas:{screen: Paradas},
});

export default class App extends Component{

  render() {
    return (
       <Container>
       <Header style={styles.nav}>
        <Body>
         <Text style={styles.navText}>Conexão com Bluetooth</Text>
       </Body>
       </Header>

      <View style={styles.container}>
      <Content>
      <List>
         <Button block style={styles.buttonStyle}><Text>Escanear</Text></Button>
         <Button block style={styles.buttonStyle}><Text>Desconectar</Text></Button>
         <ListItem itemHeader>
         <Text>Dispositivos disponíveis</Text>
         </ListItem>
         <Button block style={styles.buttonStyle} onPress={() => this.props.navigation.navigate('HomeScreen')}><Text>Tela Principal</Text></Button>
       </List>
       </Content>
       </View>
     </Container>

    );
  }
}

const styles = StyleSheet.create({
  nav: {
    backgroundColor: '#2F314A',
  },

  navText: {
    color: '#fff',
    fontSize: 18,
    fontWeight: 'bold',
  },

  container: {
   flex: 1,
   backgroundColor: '#F5FCFF',
   top: 2,
   padding: 10,

 },

  buttonStyle: {
    backgroundColor: '#2F314A',
    marginBottom: 5,
    height: 40,
  },

});