mileung / top-bar-nav

A top bar navigator for React Native that is super light, simple, and customizable.
https://www.npmjs.com/package/top-bar-nav
34 stars 5 forks source link

top-bar-nav support RTL direction #2

Open RanyHajYahia opened 4 years ago

RanyHajYahia commented 4 years ago

Hi, I would like to thank you for this navigator, it's very useful and I am currently using it in my project. I am opening this ticket since I have a translated application to RTL direction languages (Arabic / Hebrew) and the navigator is not supporting this direction. It will be very helpful if "isRTL" boolean indicator will be added to this component in the next release.

Thanks

mileung commented 4 years ago

I don't have the time to update this package. Open to PRs though!. Although couldn't you solve your problem with the initialIndex prop?

RanyHajYahia commented 4 years ago

InitialIndex should be always 0, in RTL languages 0 start from the right and better not to do manipulations like initiating index from the last or reverse arrays. (because swiping left and right for changing tabs also should be opposite) Please advise where I can report about the case if there is any support for this package.

mileung commented 4 years ago

You or someone else can make a PR for this feature and I'll probably approve and publish it in a new version.

vaporwavie commented 4 years ago

@RanyHajYahia if you only need to enable rtl within the HOC (top-bar-nav, that is), I think you can make it work by creating a prop like isRTL and thus applying the necessary styles. I can give you some insights if you want to!

RanyHajYahia commented 4 years ago

@vaporwavie anything can help before I start trying myself. especially how to increase index on swiping right (unlike English that swiping left). Thanks

vaporwavie commented 4 years ago

@RanyHajYahia I suppose you don't necessarily need to increase the index? I was imagining a CSS approach. You shouldn't have to literally update an index position just to make RTL-ready.