React Native AWS Amplify Background Image

Question

Hey guys I am trying to make an app using AWS Amplify and React Native. I want to just add a background image to my app and for that small purpose, I don't want to create an entirely custom component to display for the Sign In Screen. Here is my code.

import React, { useEffect } from 'react';
import { Text, View, StyleSheet, StatusBar, ImageBackground, Image } from 'react-native';
import SplashScreen from 'react-native-splash-screen';
import Amplify from 'aws-amplify';
import awsconfig from './aws-exports';
import { Authenticator, AmplifyTheme } from 'aws-amplify-react-native';

Amplify.configure(awsconfig);

console.disableYellowBox=true;

const App = function() {
  
  useEffect(() => {
    SplashScreen.hide();
  }, []);

  return(
    <View style={styles.container}>
      <StatusBar 
        barStyle = 'light-content'
        backgroundColor='black'
      />
      <Authenticator usernameAttributes="email" > 
      </Authenticator>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: 'black'
  }
});

export default App;

I know ImageBackground should do the job but I don't know how to integrate the Amplify sign in with it.

Thanks in advance.