I have this Component:
render() {
return (
<ScrollView style={styles.container}>
<View style={styles.body}>
<View style={styles.LogoContainer}>
<Image resizeMode="contain" style={styles.logo} source={require('../../images/logo.png')}/>
</View>
<View style={styles.bottomContainer}>
<TextInput selectionColor="white" placeholderTextColor="white" placeholder="Email" style={styles.input} underlineColorAndroid='transparent'/>
<TextInput selectionColor="white" placeholderTextColor="white" secureTextEntry={true} placeholder="Password" style={styles.input} underlineColorAndroid='transparent'/>
<TouchableOpacity onPress={() => {}} style={styles.btn}>
<Text style={styles.btnTxt}>LOG IN</Text>
</TouchableOpacity>
</View>
</View>
<View style={styles.footer}>
<TouchableOpacity onPress={() => {}}>
<Text style={[styles.footerTxt, {color: '#fff'}]}>Don’t have an account?</Text>
</TouchableOpacity>
</View>
</ScrollView>
)
}
What I want is to position the latest view with style={styles.footer}
(Sticky Footer). I tried to set position: "absolute, bottom:0"
, but not working. Parent container (ScrollView
) has height:"100%"
and position:"relative"
, if this matter for React Native.