Formik button won't render with Scrollview - react-native

Working with a long form in Formik that needs Scrollview. Scrollview works for the form; however it will not render the submit button at the bottom of the form.
Can I define the form with a container element, use Scrollview and leave button outside element so it will stay at the bottom of the viewport.
FYI working in React navigation v5 with a Tab Navigation at bottom of viewport.
Thanks

Related

How to hide react bottom navigation without showing animation?

Bottom navigation tabs don't hide without animation. Whenever I use the text input in react native bottom navigation tab is pushed up by the keyboard. That was somewhat solved by using:
screenOptions={{
tabBarHideOnKeyboard: true,
}}
However, even after trying that bottom tab is seen for a moment. Is there a way to not see that bottom tab or turn off that bottom tab appearing and disappearing animation? I'm using react-navigation bottom tabs.

React Native bottom tab navigation btn event in current screen

In React Native bottom tab navigation, how can I create my own custom btn that on press makes action in the current screen and not navigate in other screens?
*I know how to create custom btn

Drawer header is rendering after components below it

I have a bottom tab inside drawer navigation. When I switch the tab,lets say from "Home" tab screen to "Profile" tab screen, I want to hide the drawer header, it is hiding via navigtion.setOptions inside componentDidMount but it is hiding after the components inside "Profile" screen are rendered. How can I make sure the drawer header will hide before rendering of components inside "Profile" tab screen?

React navigation button behind transparent header not clickable

I have a component that when scrolling a button remains at the same height as the header, that header has headerBackTitleVisible: true, and when pressing those buttons in that position, they do not work.
I have tried with headerMode to float or to screen but I still can't find the solution

How do I create a native looking modal view segue with react-native?

Is there an way to perform a modal segue, animating the view and navbar up from the bottom, covering the existing navbar, view and tabbar, etc. ?
There is a similar example in UIExplorer where the view
'Navigator' uses 'configureScene' to float a view (but not the navbar) from bottom via Navigator.SceneConfigs.FloatFromBottom, etc. Native app modal segues are supposed to animate the new navbar and view up from the bottom. Note: A good example of this is the health app, click on 'medical ID' tab, then tap on 'Edit' button in navbar, and notice how its navbar and view animates and covers the existing navbar, tabbar and view.
I can see a modal segue in the facebook groups app, which is react-native from my understanding. Clicking on the 'Groups' tab, the click on the 'create' navbar button.
Does anyone know how to implement a native modal segues in react-native?

this.props.navigator.push({
title: 'Pick Date',
sceneConfig: Navigator.SceneConfigs.FloatFromBottom,
component: DatePickerView,
navigationBar: <NavigationBar
title="Initial View"/>,
passProps: {handleSelectedDate: this.handleSelectedDate}
})
Link to source is here: https://github.com/aaronksaunders/React-Modal-Nav-Example

I work on the React Native Navigator component.
To accomplish this, you can put a Navigator within the scene of another Navigator. The outside navigator configures its scene with Navigator.SceneConfigs.FloatFromBottom or something similar. Inside the scene, you can have another <Navigator> with navigationBar={<Navigator.NavigationBar ...etc />}