Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

allow to disable RTL behaivour #212

Open
YogiHa opened this issue Apr 17, 2021 · 8 comments
Open

allow to disable RTL behaivour #212

YogiHa opened this issue Apr 17, 2021 · 8 comments

Comments

@YogiHa
Copy link

YogiHa commented Apr 17, 2021

currently, there is no good support for RTL cases.

Mostly, there's no need to change the way of displaying the bars or the way seek behavior will affect video volume or position' due to the fact that rtl users used to look on video's as ltr users.

currently, I added manulay:

const position = evt.nativeEvent[I18nManager.isRTL ? 'pageX' : 'locationX']

for a quick fix (and not perfect) of pan behavior,

and

 flexDirection: I18nManager.isRTL ? 'row-reverse' : 'row',

for keep normal shape of bars

Blocking specific view from being rtl seems as a bigger issue with RN https://stackoverflow.com/questions/58144342/react-native-is-there-a-way-disable-rtl-in-a-specific-view-or-maintain-the-same

@subhayughosh
Copy link

subhayughosh commented Apr 17, 2021

Hi @YogiHa I replied to the StackOverflow question you linked. Below is a probable solution

Import like so:
import { I18nManager } from 'react-native';

To force RTL use:
I18nManager.forceRTL(true);
and use textAlign : "right" for RTL OR textAlign : "left" for LTR on your textInput.

In case you don't want RTL then use:
I18nManager.allowRTL(false);

Here is the RN Official Blog Link where you will get detailed use cases.

@YogiHa
Copy link
Author

YogiHa commented Apr 17, 2021

@subhayughosh I spoke on cases which the whole app is indeed RTL, so the solution of

I18nManager.allowRTL(false)

Less relevant

@subhayughosh
Copy link

@YogiHa Yes agree. The GH issue you raise is relevant and the hack you have is a good workaround.

I was answering the SO question which was more about text and not about graphs.

@theMasix
Copy link

Hello @YogiHa I have same issue here. My whole app is RTL so the video player controls are reversed. Could you please provide more info about how you fixed this issue? How should I create position variable and where to set it?

Also I set flexDirection: row but the pan behavior didn't fixed.

@YogiHa
Copy link
Author

YogiHa commented Apr 21, 2021

Hey @theMasix,

I will try to create PR later with the option to pass the prop disallowRTL, in case it will accepted...

@theMasix
Copy link

@YogiHa Thanks for your future PR. But I have to fix this issue now, I would be happy if you can tell me about the quick fix before the PR

@ferasabufares
Copy link

ferasabufares commented Jun 23, 2021

my app use I18nManager.forceRTL(true);

@YogiHa i am waiting for your PR did

@YogiHa
Copy link
Author

YogiHa commented Jun 24, 2021

@ferasabufares totally forgot about it,

here is the PR - #222

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants