Register screen

import React, { Component } from 'react';
import { View, ScrollView, Alert, KeyboardAvoidingView } from 'react-native';
import Styles from '../Styles';
import { Header, Button, Input, Logo } from '../Components/';
import { AppServices } from '../Services/';

class RegisterForm extends Component {
  constructor(props) {
    super(props);
    this.state = {
      username: '',
      password: '',
      passwordConfirm: '',
      email: '',
      type: 0,
      name: '',
      addres: '',
      phoneNumber: ''
    };
  }

  selectTypeOfUser() {
      Alert.alert('¿Comó vas a usar la app?', 'Cliente si quieres buscar algo.\nNegocio si quieres darte a conocer.',[
        {
          text: 'Cliente',
          onPress: () => this.setState({ type: 1})
        },
        {
          text: 'Negocio',
          onPress: () => this.setState({ type: 2})
        }
      ]);
  }
  makeRegister() {

    const service =new AppServices();
    service.registerUser(this.state.username,
      this.state.password,
      this.state.email,
      this.state.name,
      this.state.addres,
      this.state.phoneNumber,
      this.state.type).then((response) => {
        console.log(response);
        switch (response) {
          case 'success':
            Alert.alert('Éxito','Cuenta creada correctamente.');
            this.props.navigator.pop();
            break;
          case 'InvalidMail':
            Alert.alert('Error', 'Correo Invalido');
            break;
          case 'AlreadyExist':
            Alert.alert('Error', 'Usuario o Correo existente');
            break;
          default:
            Alert.alert('Error', 'Vuelve a intentarlo por favor.');

        }
        this.setState({
          username: '',
          password: '',
          passwordConfirm: '',
          email: '',
          type: 0,
          name: '',
          addres: '',
          phoneNumber: ''
        });
      });
  }
  formType() {
    switch (this.state.type) {
      case 0:
        return (
          <KeyboardAvoidingView behavior='padding' style={Styles.PageCenterContainer}>
            <Input value={this.state.username} placeholder="Usuario" onChangeText={username => this.setState({ username })} />
            <Input isPassword placeholder="Contraseña" onChangeText={password => this.setState({ password })} />
            <Input isPassword placeholder="Confirmar contraseña" onChangeText={passwordConfirm => this.setState({ passwordConfirm })} />
            <Input value={this.state.email} placeholder="E-mail" onChangeText={email => this.setState({ email })} />
            <Button text='SIGUIENTE' color='#ef5350' onPress={this.selectTypeOfUser.bind(this)} />
          </KeyboardAvoidingView>
        );
      break;
      case 1:
        return (
          <ScrollView style={Styles.PageCenterContainer}>
            <ScrollView>
              <Input placeholder="Nombre" onChangeText={name => this.setState({ name })} />
              <Button text='FINALIZAR' color='#EE2C2A' onPress={this.makeRegister.bind(this)} />
            </ScrollView>
          </ScrollView>
        );
      break;
      case 2:
        return (
          <ScrollView style={Styles.PageCenterContainer}>
            <ScrollView>
              <Input placeholder="Nombre" onChangeText={name => this.setState({ name })} />
              <Input placeholder="Dirección" onChangeText={addres => this.setState({ addres })} />
              <Input placeholder="Telefono" onChangeText={phoneNumber => this.setState({ phoneNumber })} />
              <Button text='FINALIZAR' color='#EE2C2A' onPress={this.makeRegister.bind(this)} />
            </ScrollView>
          </ScrollView>
        );
      break;
    }


  }

  render() {
    return (
      <View style={Styles.ScreenContainer}>
        <Header title="Registro" leftButton='back' nav={this.props.navigator}/>
          <Logo />
          {this.formType()}
      </View>
    );
  }
}

export { RegisterForm };