itsnubix/react-native-video-controls

allow to disable RTL behaivour

Opened this issue · 8 comments

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

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.

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

I18nManager.allowRTL(false)

Less relevant

@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.

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.

Hey @theMasix,

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

@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

my app use I18nManager.forceRTL(true);

@YogiHa i am waiting for your PR did

@ferasabufares totally forgot about it,

here is the PR - #222