Keyboard squeezing components

When I click on TextInput, the images are squeezed:

How to fix?

import React, { Component } from 'react';
import {Text, View, TouchableHighlight, ImageBackground, TextInput, Image, Picker} from 'react-native';
import {Button} from 'react-native-elements';

class Consulta extends Component{
constructor(props){
super(props);
this.state={
  ambiente:0,
  busca:''
}
}


  render(){
return(
  <View style={{flex:1, flexDirection:'row'}}>


    <View style={{flex:5}}>
      <ImageBackground style={{flex:1, width: null, height: null}} source={require('../img/bg.png')}>

        <View style={{flex:1, flexDirection:'row'}}>
          <View style={{flex:1}}></View>

          <View style={{flex:10, flexDirection:'column'}}>
            <View style={{flex:1}}></View>

            <View style={{flex:2, justifyContent:'center'}}>
              <Text style={{fontSize:50, color:'#484b4c'}}>CONSULTA DE FLORES</Text>
            </View>

            <View style={{flex:2, justifyContent:'center'}}>
              <Text style={{fontSize:20, color:'#484b4c', marginBottom:10}}>NOME OU CÓDIGO</Text>
              <TextInput
                style={{height:60, borderColor:'gray', borderWidth:1, backgroundColor:'white', borderRadius:10}}
                onChangeText={(text) => this.setState({busca: text})}
              />
            </View>

            <View style={{flex:5, justifyContent:'center', alignItems:'flex-start'}}>
              <View>
              <Text style={{fontSize:20, color:'#484b4c', marginBottom: 10}}>TIPO DE AMBIENTE</Text>
              </View>

              <View style={{flex:1, flexDirection:'row'}}>

              <View style={{flex:1}}>
                <TouchableHighlight style={{flex:1}}
                  onPress={() => this.props.navigation.navigate('Consulta')}>
                  <Image
                    style={{flex:1.1, width: null, height: null}}
                    source={require('../img/icone/ambiente1.png')}
                  />
                </TouchableHighlight>
                <View style={{alignItems:'center'}}>
                  <Text style={{fontSize:20}}>INTERNO</Text>
                </View>
              </View>

              <View style={{flex:1}}>
                <TouchableHighlight style={{flex:1}}
                  onPress={() => this.props.navigation.navigate('Consulta')}>
                  <Image
                    style={{flex:1.1, width: null, height: null}}
                    source={require('../img/icone/ambiente2.png')}
                  />
                </TouchableHighlight>
                <View style={{alignItems:'center'}}>
                  <Text style={{fontSize:20}}>EXTERNO</Text>
                </View>
              </View>

              <View style={{flex:1}}>
                <TouchableHighlight style={{flex:1}}
                  onPress={() => this.props.navigation.navigate('Consulta')}>
                  <Image
                    style={{flex:1.1, width: null, height: null}}
                    source={require('../img/icone/ambiente3.png')}
                  />
                </TouchableHighlight>
                <View style={{alignItems:'center'}}>
                  <Text style={{fontSize:20}}>INTERNO E EXTERNO</Text>
                </View>
              </View>

              </View>

            </View>

            <View style={{flex:3, flexDirection:'row'}}>

              <View style={{flex:1, justifyContent:'center', alignItems:'center'}}>
              <Button
                large
                backgroundColor='#d0e25f'
                buttonStyle={{borderRadius:20}}
                textStyle={{fontSize:40, color:'#383838'}}
                iconRight={{name:'search', type:'font-awesome', size:40, color:'#383838'}}
                title='PESQUISAR'
                onPress={() => this.props.navigation.navigate('Resultado', {busca: this.state.busca})}
              />
              </View>

            </View>

            <View style={{flex:1}}></View>
          </View>

          <View style={{flex:1}}></View>
        </View>

      </ImageBackground >
    </View>

    <View style={{flex:1}}>

      <View style={{flex:1}}>
        <TouchableHighlight style={{flex:1}}
          onPress={() => this.props.navigation.navigate('Consulta')}>
          <Image
            style={{flex:1, width: null, height: null}}
            source={require('../img/consultaOn.png')}
          />
        </TouchableHighlight>
      </View>

      <View style={{flex:1}}>
        <TouchableHighlight style={{flex:1}}
          onPress={() => this.props.navigation.navigate('FormaPagamento')}>
          <Image
            style={{flex:1, width: null, height: null}}
            source={require('../img/formaOff.png')}
          />
        </TouchableHighlight>
      </View>

      <View style={{flex:1}}>
        <TouchableHighlight style={{flex:1}}
          onPress={() => this.props.navigation.navigate('Organizacao')}>
          <Image
            style={{flex:1, width: null, height: null}}
            source={require('../img/organizacaoOff.png')}
          />
        </TouchableHighlight>
      </View>

      <View style={{flex:1}}>
        <TouchableHighlight style={{flex:1}}
          onPress={() => this.props.navigation.navigate('Horario')}>
          <Image
            style={{flex:1, width: null, height: null}}
            source={require('../img/horarioOff.png')}
          />
        </TouchableHighlight>
      </View>

    </View>

  </View>
);
}
}

export default Consulta;