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

Problem in RTL apps #68

Closed
iamsoorena opened this issue Aug 29, 2018 · 2 comments · May be fixed by #70
Closed

Problem in RTL apps #68

iamsoorena opened this issue Aug 29, 2018 · 2 comments · May be fixed by #70
Labels

Comments

@iamsoorena
Copy link

react-native-copilot completely renders mirror of what it should be rendering in RTL projects.
Here I've made a CopilotView around the heart ❤️ icon like this:

const CopilotView = walkthroughable(View);
...
<CopilotView>
  <HeartIcon/>
</CopilotView>

As you can see it's completely mirrored.
If you point me to the right direction I'll fix it myself.
Thank you for your efforts.

@mohebifar
Copy link
Owner

How are you making the layout RTL? Are you doing that by changing the flexDirection? Or there's a different way?

Looking at the screenshot, NativeView.measure() appears to be actually returning right as left.

You may also want to add androidStatusBarVisible: true to the copilot({ ... }) HOC options since it seems that the status bar is not translucent.

@iamsoorena
Copy link
Author

@mohebifar I'm making RTL layout using standard method with I18nManager.allowRTL and I18nManager.forceRTL, no flex magic.
The problem was that in this project right and left properties were hard-coded. but react-native swaps these two in RTL projects.
so I resolved this problem and sent a PR.
thanks for androidStatusBarVisible: true tip, saved me a lot of time. :)

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

Successfully merging a pull request may close this issue.

3 participants