React-native-navigation: [Request] - support critical common modern UI concepts

[dzunglht-ibl]

Hi team,
We love your work, would you please consider support our community a horizontal swipable band menu like the tabview (a kind of tabs but its a horizontal swipable on NEXT/PRIVOUS, and show large pictures on its menu item, there is a non-native implementation but it not good and slow performance. It's great if you can support like theirs
Refs:

1. a demo of multiple viewpagers UX
2. https://github.com/leecade/react-native-swiper
   Tons of thanks

[dzunglht-ibl]

20 days passed, we love your great work. please help resolve this ticket
Tons of thanks

[DanielZlotin]

Do you mean you want swipes on top tabs? we already support that in android

[guyca]

@dzunglht The new example app which @Ehesp is working on has an example for this type of screen.
It will be merged soon, You can check it out here: https://github.com/wix/react-native-navigation/pull/1139

[dzunglht-ibl]

@DanielZlotin & @guyca as well, I don't mean tab swipes, i mean a seperate horizontal pictured swipable band menu above the tab titles. Please help have a look on this UI concepts (the bottom ref), i just recorded a video for you guys. Currently, we use this non-native component for that concept but it's performance is not good because it's implementation is totally pure javascript. Hope you guys have a native porting for this common UI concept in next release.
Ref: horizontal pictured swipable bandmenu (Let me know if you could not see the demo
Tons of thanks

[DanielZlotin]

Cool, this looks like viewpager inside another viewpager, both with their own tabbar.

This is not supported, but I can think of 2 general solutions. The first, using react-native-navigation: it may be possible to do in a future version. This will require us to support composition of homogeneous tree structures (which we kinda do in v2 under the hood), then you will be able to basically create any layout you want out of the supported layout types (for example viewpager->bottomTabs->viewpager-> all inside a sidemenu!).

The second solution is to come up with another open source project dedicated just for viewpagers :)

[DanielZlotin]

And by the way, this is not that common ;)

[dzunglht-ibl]

@here, in modern UI/UX principles (i also mean enterprise and professional practices, not "Hello World"/ "Just for fun prototype"), that is a very critical common concept. Many of our RN outsourcing customers from famous firms require that concept for their app. We love your work and strongly believe that this Wix library will be soon the most critical must-have for enterprise RN development. To be different and reinforce your current leading position in RN navigation, please help consider solving critical modern UI/UX concepts first
Tons of thanks

[dzunglht-ibl]

@guyca and folks, its been 25 days, we love your work, please make Wix great again !
Tons of thanks

[Ehesp]

@dzunglht I'm confused as to what you're after here. This is a navigation lib, and you're looking for a ViewPager, which is out of scope in my eyes of this lib.

[Ehesp]

@dzunglht How about looking into https://reactnavigation.org/docs/navigators/tab ? It's as performant for a JS based solution as you're going to get. Based on that video though, it's totally do-able using a ViewPager/ScrollView, and you shouldn't have performance issues if you implement it correctly.

[DanielZlotin]

To OP's defense, breaking common patterns can make for a really interesting app.. even though in this case I don't understand the swipe behavior (what happens if I swipe from the edge of the screen? which tab will be selected?)

I would take this use case as a challenge going forward, but not before tackling all major features and milestones

[dzunglht-ibl]

@Ehesp Thanks for you opinion, although this is a navigation lib BUT have you ever figure out how to made it work with a ViewPager ? Can you customize the layout and API use of Navigation.startTabBasedApp() so that it can work with another ViewPager ? If your need is at "hello world" target, im satisfied with you answer ... Indeed, startTabBasedApp follows outdated UI/UX (not compatibility with modern UI/UX practice) and seems not to be made to work with 3rd components on the same level of layout hierarchy (not child items put on it)

[dzunglht-ibl]

@DanielZlotin If you swipe from the edge of the screen, depend upon your edge either LEFT or RIGHT and the swipe direction, if current tab is the end, your swipe action will reset the current focused tab to the first tab.
Please kindly note that current API Navigation.startTabBasedApp cannot work with 3rd components on the same level of layout hierarchy, i.e. current approach forces developers to create a new screen/child items put on the tab page container.
Thanks

[dzunglht-ibl]

@guyca how about your opinion ?

[dzunglht-ibl]

29 days passed

[kelvin-dev]

Where are you guys, please help resolve this ticket

[guyca]

Hey guys
I think @Ehesp and @DanielZlotin have answered op's question. Next major version was built to support such use cases - you will be able to construct your screens as you'd like, Meaning that a screen with multiple view pagers is theoretically possible. This might not be fully supported initially since there are more pressing matters.

[kelvin-dev]

please help resolve this ticket asap, this is also an urgent need from current market !
Regards

[kelvin-dev]

where are you guys, this ticket already showed current drawback and enterprise market demand, please resolve it !
Thanks

[Ehesp]

@meow0703 the question has already been answered. It's currently not a priority as version 2 is in the works, where such "critical components" will be supportable. It's definitely something the wix guys would love to support but currently it's not easily doable with v1.

PRs are welcome to.

[kelvin-dev]

@guyca
@DanielZlotin
@talkol
@gran33
@yedidyak
@artald
@BrendonSled
@rotemmiz
Sorry guys, we and many clients around the world have been facing the above UI pattern, please support multiple viewpagers. You maybe the first one in this area breaking traditional UI pattern.
Modern proven UI pattern example: https://youtu.be/oyLhVvu5p6s (please have a look on it)
p/s: thanks much @dzunglht

[dzunglht-ibl]

Please help support this ticket guys, very promising feature !
Regards,

[guyca]

@dzunglht @meow0703 This issue has been addressed in v2. Thanks a lot for your continued support of this project.