search

SteffeyDev / react-native-popover-view

A well-tested, adaptable, lightweight <Popover> component for react-native
MIT License
614 stars 92 forks source link

Not working in RTL direction #44

Open ansarikhurshid786 opened 5 years ago

ansarikhurshid786 commented 5 years ago

I am showing popup but when i switched to arabic language. application direction get changed as below : 

if(language == "arabic"){
I18nManager.allowRTL(true);
}

After allowing RTL when i tried to show popup screen stuck.

SteffeyDev commented 5 years ago

Need to know more details:

SteffeyDev commented 5 years ago

Also, the code sample is not very useful, because you don't state where it is defined. Is this Java? JavaScript? Swift? Where is I18nManager imported from?

SteffeyDev commented 5 years ago

Also going to need screenshots or precise steps to reproduce.

ansarikhurshid786 commented 5 years ago

react-native info : info 

React Native Environment Info:
    System:
      OS: macOS 10.14.5
      CPU: (16) x64 Intel(R) Xeon(R) CPU E5-1680 v2 @ 3.00GHz
      Memory: 3.05 GB / 16.00 GB
      Shell: 3.2.57 - /bin/bash
    Binaries:
      Node: 10.15.0 - /usr/local/bin/node
      Yarn: 1.13.0 - /usr/local/bin/yarn
      npm: 6.10.1 - /usr/local/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
      Android SDK:
        API Levels: 19, 20, 21, 22, 23, 24, 25, 26, 27, 28
        Build Tools: 23.0.1, 23.0.3, 25.0.1, 25.0.2, 26.0.1, 27.0.1, 27.0.3, 28.0.2, 28.0.3, 29.0.0
        System Images: android-22 | Google APIs Intel x86 Atom, android-22 | Google APIs Intel x86 Atom_64, android-23 | Intel x86 Atom, android-23 | Google APIs Intel x86 Atom_64, android-Q | Google APIs Intel x86 Atom
    IDEs:
      Android Studio: 3.4 AI-183.6156.11.34.5522156
      Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild
    npmPackages:
      react: ^16.8.6 => 16.8.6 
      react-native: ^0.59.9 => 0.59.9 
    npmGlobalPackages:
      react-native-cli: 2.0.1

"react-native-popover-view": "^2.0.2",

I am facing issue in all devices. I tested in ios emulator 7 plus, x, xr and in android samsung galaxy 8+(android 9).

ansarikhurshid786 commented 5 years ago

@SteffeyDev can you please check issue as soon as possible. I am looking for solution

SteffeyDev commented 5 years ago

I tried to look into it but changing the language in the iOS simulator did not affect my test app one bit; it was still English and worked as expected. What steps do I need to take to reproduce the issue? Do you have a sample app you can share demonstrating the issue?

SteffeyDev commented 5 years ago

I don’t have any app localized for Arabic to test with

ansarikhurshid786 commented 5 years ago

Application initialization : 

import { AsyncStorage, I18nManager } from "react-native";
import RNRestart from 'react-native-restart';

AsyncStorage.getItem("lang").then(language => {
if (language == "ar") {
        this.setState({position: "right"}); 
        I18nManager.allowRTL(true);
        I18nManager.forceRTL(true);
        if (!I18nManager.isRTL) {
          RNRestart.Restart();
        }
      } else {
        this.setState({position: "left"}); 
        I18nManager.allowRTL(false);
        I18nManager.forceRTL(false);
        if (I18nManager.isRTL) {
          RNRestart.Restart();
        }
      }
      i18n.locale = language;
}
ansarikhurshid786 commented 5 years ago

application stuck no response when i tried to open popup in arabic language(in RTL enable mode)

SteffeyDev commented 5 years ago

Ok, thanks for the code. I've investigated further and found many issues with RTL layouts and this library. With some work I can make the popover actually appear, but there seems to be some layout issues that result in the popover being slightly off position. Not sure if it is an RN issue or on my end yet, but the built-in inspector bugs out in RTL. I'll push out a basic fix soon and then continue investigating the weird layout issues.

SteffeyDev commented 5 years ago

Alright, version 2.0.4 is out with a basic fix, the popover should be visible but may be in the wrong place on the screen. Let me know how it works for you. I'll keep investigating the layout issues and see what's up.