Как открыть интерактивное меню dev на реальном устройстве

Я уже видел ряд пограничных случаев и странный интерфейс разработчика.

Из "shake your device" , что действительно непрактично, особенно с планшетом

Чтобы работать с Android-студией, чтобы имитировать нажатие кнопки.

Есть ли последовательный способ сделать это? Разве мы не можем использовать intern API для запуска отладочной кнопки в нашем приложении для запуска такого меню, как navigator.popUpDevMenu()?

И если нет, как вы пожимаете свой планшет, чтобы заставить его работать. Это предназначено для решения Как настроить HMR на реальном устройстве. React native улучшает опыт разработки, но я бы сказал, что эта вещь немного замедляет его.

Ответ 1

Если вы на Mac, есть удобный инструмент под названием Frappe. 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 и входит в число хаков, предложенных в вопросе выше. Так что это невозможно. Тем не менее, он выбран в качестве действительного ответа, пока это не произойдет.

Ответ 2

В случае, если у вас есть телефон Xiaomi, данный ответ не будет работать, потому что есть опция безопасности, которая запрещает открывать всплывающее окно, и вам нужно разрешить его для вашего приложения:

Перейдите в "Настройки"> "Установленные приложения"> [Ваше имя приложения]> "Менеджер разрешений" и включите "Отображать всплывающее окно".

Встряхните снова. Меню разработчика должно появиться, как и ожидалось, с небольшим встряхиванием.

Источник: https://matthewphiong.com/debugging-react-native-app-on-a-xiaomi-phone

Ответ 3

Вот что я делаю:

Android:

Добавьте скрипт в ваш package.json:

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

После этого вы сможете вызвать yarn android-shake чтобы всплывающее меню на Android (при условии, что устройство подключено к компьютеру).

IOS

Настройки → Специальные возможности → AssistiveTouch

Включи это.
Нажмите на Настроить меню верхнего уровня...
Удалите все значки, кроме одного, и установите его на встряхивание.

Это даст вам кнопку, которую вы можете нажать вместо встряхивания устройства.

Я надеюсь, что это может помочь другим.

Ответ 4

Я создал библиотеку, которая позволяет вам использовать прикосновение 3 пальцев вместо встряхивания, чтобы открыть меню разработчика в режиме разработки

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>
    );
  }
}

Это действительно полезно, когда вам нужно отладить на реальном устройстве, и рядом с вами сидят сотрудники.

Ответ 5

Я добавляю простую абсолютно позиционированную кнопку и этот обработчик onClick

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