react-native-drawer example with react-native-router-flux 4

[vijaychouhan-rails]

Can you please provide me an example of react-native-drawer with react-native-router-flux 4

[aksonov]

v4 uses built-in react-navigation drawer.

[vijaychouhan-rails]

@aksonov

I know but I want to use react-native-drawer because I need to use displace screen feature but in-build drawer does not provide this.

[aksonov]

Try new overlay and contentComponent props (not documented, PR will be useful):

<Scene overlay contentComponent=`CustomDrawer`>
   <Scene>...</Scene>
   <Scene>...</Scene>
   <Scene>...</Scene>
</Scene>

Within CustomDrawer you define your drawer. The question is how to call drawer open/close... We need to think about it, but try this first.

[raynor85]

I have successfully implemented it. The CustomDrawer must specify this.props.children in the render function in order to display its nested Scenes. The only problem I am experiencing now is removing the animation transitions. In my implementation, using type="reset" to <Scene overlay contentComponent=CustomDrawer> avoid the initial transition. Maybe the approach mentioned here could be useful to get rid of unwanted animated transitions.
#2062

[themakerman]

@raynor85 What does overlaycontentComponent prop does to the Scene?

[foyarash]

Hello,

I don't receive the children in the props, how can I retrieve them?

[raynor85]

@foyarash, maybe this is related to #2496
Try the version beta.17, since the overlay seems to be removed in beta.18, and let me know

[raynor85]

@themakerman it is just a wrapper used to add a component in the top of the app

[foyarash]

OverlayNavigator is actually present in beta.22

[raynor85]

@foyarash OverlayNavigator is indeed present in beta.22, but no longer accept contentComponent as a prop. My pr #2578 solves that.

[mightym]

How do I receive the the children there?