web-dev-qa-db-ja.com

デバイスの向きをロック-React Native（Android）

私はReact Native 0.29を使用してAndroid向けに開発しています。デバイスの向きをロックしようとしています。ポートレートモードで画面をロックするために必要なことです。このリポジトリで試しました- https://github.com/yamill/react-native-orientation ですが、RN 0.29はまだサポートされていません。

デバイスの向きをロックする方法はありますか？多分ネイティブAndroid Android studio？

androidreact-nativeorientationdevice-orientation
13
Provash Shoumma

AndroidManifest.xmlのアクティビティにAndroid：screenOrientation = "portrait"を追加するだけです。

25
Felipe Martim

2017年アップデート

現在、AndroidとiOSの両方に対して一度追加する別の方法もあります：

_"orientation": "portrait"_

expoを使用している場合は_app.json_内：

_{
  "expo": {
    "name": "My app",
    "slug": "my-app",
    "sdkVersion": "21.0.0",
    "privacy": "public",
    "orientation": "portrait"
  }
}
_

または実行時に：

ScreenOrientation.allow()

例：

_ScreenOrientation.allow(ScreenOrientation.Orientation.PORTRAIT);
_

Expoで構築している場合にのみ機能することに注意してください。これは現在（2017年現在） React Native Blog の公式ガイドで推奨されているため、おそらく多くの人が使用しているので、言及する価値があります。 Android固有のXML構成ファイルをハッキングすることに加えて、興味深いソリューションとして。

より詳しい情報：

詳細については、React Native？）でローテーションを無効にする方法を参照してください。

2
rsp

これが0.29.2以降で動作するようにプルリクエストがあります： https://github.com/yamill/react-native-orientation/pull/85

彼のバージョンを使用する場合、0.29.2以降で動作するはずです。 https://github.com/youennPennarun/react-native-orientation

手順：

  1. 以前のインストールをrnpm unlink react-native-orientationでリンク解除します
  2. rm -rf node_modules/react-native-orientation

  3. package.jsonで、react-native-orientationのエントリを次のように編集します。

    "react-native-orientation": "youennPennarun/react-native-orientation"

  4. npm install

  5. react-native link react-native-orientation

これで問題は解決するはずです。 PRの進行状況を追跡し、マージされたらメインリポジトリに切り替えることができます。

2
Aakash Sigdel

react-native-orientation-locker を使用できます。

'react-native-orientation'は廃止されました。 'react-native-orientation-locker'コンポーネントを使用すると、次のコマンドを使用して、現在の方向を検出し、ポートレート/ランドスケープにロックできます。

Orientation.lockToPortrait();

Orientation.lockToLandscapeLeft();

を使用してロックを解除する

Orientation.unlockAllOrientations();
0
Ata Iravani

ステップ：1

npm install git+https://github.com/yamill/react-native-orientation.git --save

Step2：反応ネイティブリンクStep：MainApplication.Javaファイルを次のように変更します：

import com.github.yamill.orientation.OrientationPackage;// import

@Override
protected List getPackages() {
return Arrays.asList(
new MainReactPackage(),
new OrientationPackage() //add this
);
}
0
anoopda

react-native-orientation-新しいバージョンとの互換性はなくなりました（私は0.39.2を試しました）。このモジュールをリンクした後、コンパイラのエラーが発生しました。わかったので、ここで react-native-orientation-listener を使用する必要があります

npm install --save react-native-orientation-listener
rnpmリンク

0
Sergey Onishchenko