I can't see the button and my text input doesn't work in my react native expo app

You add flexDirection:'row'a container view to your app. This means that everything you add to it will be displayed horizontally.

You are not there <GridVieweither App.

You need to cross-check the styles that affect most of the layout.

Here's a snippet modified for you.

import React, {useState, Component} from "react";
import { StatusBar, Button, StyleSheet, Text, View, TextInput, TouchableOpacity } from 'react-native';

export class GridView extends Component {
  render() {
    return (
       <View style={styles.btnContainer}>
          <View style={styles.button}>
            <Button color={'white'} title="Button 1"/>
          </View>
          <View style={styles.button}>
            <Button color={'white'} title="Button 2"/>
          </View>
          <View style={[styles.button, styles.emailBtnWrap]}>
            <TouchableOpacity>
              <Text style={styles.emailBtn}>
                Email
              </Text>
            </TouchableOpacity>
          </View>
      </View>
    );
   }
}

export default function App() {
  const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');
    return (
    <View style={styles.containerWrap}>
      <StatusBar />
      <View style={styles.textCenter}>
        <Text style={styles.textColor}>LOG IN</Text>
      </View>
      <View style={styles.formContainer}>
        <View style={styles.inputView}>
          <TextInput
            autoCapitalize="none"
            placeholder="Email."
            placeholderTextColor="#003f5c"
            onChangeText={(email) => setEmail(email)}
          />
        </View>
        <View style={styles.spacing12} />
        <View style={styles.inputView}>
          <TextInput
            placeholder="Password."
            placeholderTextColor="#003f5c"
            secureTextEntry={true}
            onChangeText={(password) => setPassword(password)}
          />
        </View>
      </View>
      <GridView />
    </View>
  );
}

const styles = StyleSheet.create({
  containerWrap: {
     flex: 1,
  },
  textCenter: {
    flex:1,
    alignItems: 'center',
    justifyContent: 'center'
  },  
  textColor: {
    color:'#000', 
    fontSize:28
  },
  formContainer: {
    flex:1,
    padding:12
  },
  inputView: {
    backgroundColor: '#f9f9f9',
    borderRadius: 30,
    borderWidth:1,
    borderColor: '#ccc',
    paddingVertical:16,
    paddingHorizontal:12
  },
  spacing12: {
    marginVertical:12
  },

  btnContainer: {
    flexDirection: 'row'
  },
  button: {
    flex:1,
    backgroundColor:'blue',
    padding:12
  },
  emailBtnWrap: {
    backgroundColor:'green'
  },
  emailBtn: {
    color:'white'
  },
  btnColor: {
    color:'white'
  }

 });