react native - Have a ScrollView inside a KeyboardAvoidingView that takes at least 100% height to layout children with flexbox -
i'm trying implement login form layouts children flexbox. contains 2 components, app logo , login form. logo should take 33% of viewports height, form should take 66%.
this relatively easy flexbox. set flex: 1
on logo , flex: 2
on form.
wrapping whole screen in keyboardavoidingview
works fine – flex layout shrinks keyboard appears, user can't see bottom elements of form, since can't fit in area above keyboard.
the obvious solution wrap form in scrollview
, wrap in keyboardavoidingview, whole form flexbox layout stops working. content container of scrollview tall children, won't take full viewport height.
i made expo snack showing layout: https://snack.expo.io/rydf0b4o-
i need layout scrollable when can't show children, seems impossible scrollview. (click second button toggle scrollview in layout)
Comments
Post a Comment