DEV Community

Discussion on: Let's Create A Custom Animated Tab Bar With React Native

Collapse
 
alisherakb profile image
Alisher Akbarov • Edited

Help wanted, please!

How can I make a draggable tab? So that on dragging to certain x,y it opens another screen?

Screenshot

Collapse
 
petarprok profile image
Petar Prokopenko

Maybe you can use draggable and then detect if div passes certain y position to redirect to state?

Collapse
 
hrastnik profile image
Mateo Hrastnik

Not sure I understand what you mean. I think you can use the MaterialTabNavigator if you want to be able to use the swipe gesture to change tabs.

Collapse
 
alisherakb profile image
Alisher Akbarov • Edited

I have three tabs, one of them is draggable from its initial position.

InitialPosition of centerTab = x: 0, y: 250:

Screenshot 1

SnapPoint of CenterTab = x: 0, y: 72 , i.e can be dragged to this Y value and open new screen:

Screenshot 2

Thread Thread
 
hrastnik profile image
Mateo Hrastnik

No idea how to help you. Perhaps Reanimated / Animatable or something like that.