KeyboardAvoidingView not working react-native - react-native

Question

Im trying to use KeyboardAvoidingView, but i got no result with them.
styled view with styled components:
export const Container = styled.View({
backgroundColor: primary,
flex: 1,
alignItems: 'center',
});
export const ImageView = styled.View({
marginTop: 16,
alignItems: 'center',
justifyContent: 'center',
});
export const InputView = styled.View({
width: '100%',
marginTop: 16,
});
export const TextView = styled.View({
marginLeft: 42,
marginRight: 42,
marginTop: 22,
alignItems: 'center',
justifyContent: 'center',
});
export const BottomView = styled.View({
flex: 1,
justifyContent: 'flex-end',
alignItems: 'center',
width: '100%',
});
And here is my layout. I set behavior = padding trying to solve my problem, but not works.
<KeyboardAvoidingView behavior="padding" style={{flex: 1}}>
<Container>
{load && <Loading />}
<TextView>
<Text value={diaryStrings.title} isModalMessage />
</TextView>
<TextView>
<Text value={diaryStrings.hintMessage} isModalMessage />
</TextView>
<TextView>
<Text value={diaryStrings.tipMessage} isModalMessage />
</TextView>
<ImageView>
<ImageSvg name={'calendar'} />
</ImageView>
<InputView>
<Input
placeholder={diaryStrings.diaryName}
placeholderTextColor={tertiary}
maxLength={20}
iconName="book"
onChangeText={text => {
setDiaryNameError('');
setDiaryName(text);
}}
maskType="nomask"
error={diaryNameError}
value={diaryName}
/>
<Input
placeholder={diaryStrings.initialDate}
placeholderTextColor={tertiary}
maxLength={10}
iconName="date-range"
onChangeText={text => {
setDiaryInitDateError('');
setDiaryInitDate(text);
}}
maskType="datetime"
error={diaryInitDateError}
value={diaryInitDate}
/>
</InputView>
<BottomView>
<Button
title={'next'}
hasBackgroundColor={true}
onPress={async () => {
setLoad(true);
await validateForm();
setLoad(false);
}}
/>
<Button
title="Cancel"
onPress={() => {
navigation.navigate('Home');
}}
/>
</BottomView>
</Container>
i think im using some property that invalidates KeyboardAvoindView. I dont wanna use an ScrollView, its possible solve this? Any one can help?

Answer 1

I've struggled to get KeyboardAvoidingView working properly too, what worked for me was using these props for KeyboardAvoidingView and wrapping content in ScrollView:
<KeyboardAvoidingView enabled keyboardVerticalOffset={90} behavior={ Platform.OS === 'ios' ? 'padding' : false } style={{ flex: 1 }} >
<ScrollView>
{all content here}
</ScrollView>
</KeyboardAvoidingView>
Also I had to use TextInput from react-native which needed to have scrollEnabled={false} prop