react-nativereact-navigation

Reactnavigation in RTL languages


So issue is that one of the app i working on as react-native developer is using

Material Top Tabs Navigator

Which is officially recommended by react-native but since it is depended on

  1. react-native-tab-view
  2. react-native-pager-view

and apparently react-native-tab-view have issue with RTL it not work properly.

Also in there limitation they also mention that rtl support is limited

https://reactnavigation.org/docs/limitations/

For me my app is causing weird behaviour in rtl and i want to ask about probable solutions for this

  1. I am able to fix this issue by forking the "react-native-pager-view" but issue remain that mean i also have to fork "Material Top Tabs Navigator" as i want to use my own pager view.

  2. One more solution i come up with is to write my own library by using native scrollview.

So what you suggest what is better option. In case one i have to wait for their solution until then i just have to keep my fork repository up-to-date but complete dependency on update for rtl.

In case 2 i have to maintain my code by myself but i good side full control over code.

which is the better option according to you and why ?


Solution

  • As for what I've read looks like we have the same problem. The way I've solved my issue is to upgrade react-native-pager-view to the latest version 6.2.0

    https://www.npmjs.com/package/react-native-pager-view

    Don't forget to delete the node modules, package-lock, pods folder and podfile.lock.

    after installing everything again the RTL issue with matirial-top-tabs will be solved.

    Hope that helps.