실제 장치에서 반응 네이티브의 개발 메뉴를 열려면 어떻게 해야 합니까?

실제 장치에서 반응 네이티브의 개발 메뉴를 열려면 어떻게 해야 합니까?

나는 이미 많은 보더 케이스와 이상한 개발자 인터페이스를 보았다.

특히 태블릿에서는 매우 비현실적인 "기기 흔들기"에서

Android Studio 주변에서 버튼 누름 시뮬레이션을 하기 위해.

관된된 방법 ?? ????하여 intern API와 같은 안 navigator.popUpDevMenu()

그렇지 않은 경우 태블릿을 흔들어서 작동하려면 어떻게 해야 합니까?이것은, 실제의 디바이스에서의 HMR 의 설정 방법을 해결하는 것을 목적으로 하고 있습니다.리액트 네이티브는 개발 경험을 향상시키지만, 그 때문에 조금 느려진다고 생각합니다.

만약 당신이 맥에 있다면, 프라페라고 불리는 편리한 도구가 있다.https://github.com/niftylettuce/frappe

이 명령어는 셸에서 사용할 수 있습니다.

adb shell input keyevent 82

달리지 react-native run-android " " " 를 한 후 react-native run-android. 개발 서버 포트를 다시 활성화해야 합니다.이 명령을 실행하고 이전 명령으로 다시 시도할 수 있습니다.

adb reverse tcp:8081 tcp:8081

편집: 이 솔루션은 Android 기기에서만 작동하며 위의 질문에서 제안된 해킹 중 하나입니다.그래서 그것은 개선될 수 있다.단, 이것이 발생할 때까지 유효한 답변으로 선택됩니다.

제가 하는 일은 다음과 같습니다.

안드로이드:

패키지에 스크립트를 추가합니다.json:

"android-shake": "adb shell input keyevent 82"

하면 여러분은 할 수 .yarn android-shakeAndroid에서 메뉴 팝업을 표시합니다(단, 장치가 컴퓨터에 연결되어 있는 경우).

iOS

설정 -> 접근성 -> 보조만지다

1. 켜봐.
2. 최상위 메뉴 사용자 지정을 누릅니다...
3. 하나의 아이콘을 제외한 모든 아이콘을 제거하고 흔들리도록 설정합니다.

그러면 기기를 흔드는 대신 누를 수 있는 버튼이 제공됩니다.

이것이 다른 사람들에게 도움이 되기를 바랍니다.

절대 위치에 있는 간단한 버튼과 이 onClick 핸들러를 추가합니다.

imoprt { NativeModules } from 'react-native';
...
onMenuButtonClick(){
 NativeModules.DevMenu.show();
}

개발 모드에서 쉐이크 대신 3개의 손가락 터치를 사용하여 개발 메뉴를 열 수 있는 lib를 만들었습니다.

https://github.com/pie6k/react-native-dev-menu-on-touch

앱을 안에 포장하기만 하면 됩니다.

import DevMenuOnTouch from 'react-native-dev-menu-on-touch';
// or:  import { DevMenuOnTouch } from 'react-native-dev-menu-on-touch'

class YourRootApp extends Component {
  render() {
    return (
      <DevMenuOnTouch>
        <YourApp />
      </DevMenuOnTouch>
    );
  }
}

이 기능은 실제 디바이스에서 디버깅을 해야 할 때 동료가 옆에 앉아 있을 때 매우 유용합니다.

Windows의 경우 메트로 번들러를 클릭하고 개발자 메뉴를 보려면 'D', 다시 로드하려면 'R'를 누르십시오.

Xiaomi 폰을 가지고 있는 경우, 주어진 답변은 작동하지 않습니다. 왜냐하면 팝업창이 열리지 않도록 하는 보안 옵션이 있기 때문에 앱에 허용해야 하기 때문입니다.

[ Settings ]> [ Installed apps ]> [ Your App Name ]> [ Permission manager ]순서대로 선택하여 [Display]팝업창을 활성화합니다.

다시 흔들어요.조금 흔들기만 하면 현상 메뉴가 예상대로 나타납니다.

출처 : https://matthewphiong.com/debugging-react-native-app-on-a-xiaomi-phone

안드로이드 폰을 흔드는 건 짜증날 때가 있어요.아래를 변경하면 Volume down / Up 키를 눌러 Developer Menu가 열립니다.

다음 코드를 에 삽입합니다.android/../MainActivity.java

  @Override
  public boolean onKeyUp(int keyCode, KeyEvent event) {
      if (keyCode == KeyEvent.KEYCODE_VOLUME_DOWN && this.getReactInstanceManager() != null) {
          this.getReactInstanceManager().showDevOptionsDialog();
          return true;
      }
      return super.onKeyUp(keyCode, event);
  }

React Native Navigation V3에서는 다음 코드가 작동합니다.MainActivity.java.

  @Override
  public boolean onKeyUp(int keyCode, KeyEvent event) {
      if (keyCode == KeyEvent.KEYCODE_VOLUME_DOWN && this.getReactGateway().getReactNativeHost().getReactInstanceManager() != null) {
          this.getReactGateway().getReactNativeHost().getReactInstanceManager().showDevOptionsDialog();
          return true;
      }
      return super.onKeyUp(keyCode, event);
  }

이 변경 후 앱을 다시 실행하여 위의 코드를 배포합니다.react-native run-android.

RN 0.59+로 테스트.

참고 자료: https://facebook.github.io/react-native/docs/integration-with-existing-apps

편집: 포함KeyEvent파일 내의 다른 Import와 함께 Import를 수행합니다.

import android.view.KeyEvent;

언급URL : https://stackoverflow.com/questions/37839666/how-do-i-open-react-natives-dev-menu-on-real-device