如何在iOS React Native App中将方向锁定为纵向?

时间:2018-07-31 09:28:29

标签: ios react-native mobile orientation

我试图取消勾选“设备方向设置”,仅勾选“纵向”选项,但它不起作用。在Android中,它不会旋转,但在iOS中,它旋转,我也不知道为什么。无论我在哪个窗口中,它都会在我的整个应用程序中旋转。 您知道锁定方向引起的旋转的其他方法吗?

enter image description here

这是我的Info.plist:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>CFBundleDevelopmentRegion</key>
    <string>en</string>
    <key>CFBundleDisplayName</key>
    <string>NEXT PORTAL</string>
    <key>CFBundleExecutable</key>
    <string>$(EXECUTABLE_NAME)</string>
    <key>CFBundleIdentifier</key>
    <string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
    <key>CFBundleInfoDictionaryVersion</key>
    <string>6.0</string>
    <key>CFBundlePackageType</key>
    <string>APPL</string>
    <key>CFBundleShortVersionString</key>
    <string>7.7</string>
    <key>CFBundleSignature</key>
    <string>????</string>
    <key>CFBundleVersion</key>
    <string>12</string>
    <key>LSRequiresIPhoneOS</key>
    <true/>
    <key>NSAppTransportSecurity</key>
    <dict>
        <key>NSAllowsArbitraryLoads</key>
        <true/>
    </dict>
    <key>NSCameraUsageDescription</key>
    <string>$(PRODUCT_NAME) necesita acceder a su cámara para poder escanear el código QR.</string>
    <key>NSLocationWhenInUseUsageDescription</key>
    <string></string>
    <key>NSMainNibFile</key>
    <string>LaunchScreen</string>
    <key>NSMainNibFile~ipad</key>
    <string>LaunchScreen</string>
    <key>NSMicrophoneUsageDescription</key>
    <string>$(PRODUCT_NAME) would like to your microphone (for videos)</string>
    <key>NSPhotoLibraryAddUsageDescription</key>
    <string>$(PRODUCT_NAME) necesita acceder a la galería para adjuntar fotos.</string>
    <key>NSPhotoLibraryUsageDescription</key>
    <string>$(PRODUCT_NAME) necesita acceder a la galería para adjuntar fotos.</string>
    <key>UIAppFonts</key>
    <array>
        <string>Entypo.ttf</string>
        <string>EvilIcons.ttf</string>
        <string>Feather.ttf</string>
        <string>FontAwesome.ttf</string>
        <string>Foundation.ttf</string>
        <string>Ionicons.ttf</string>
        <string>MaterialCommunityIcons.ttf</string>
        <string>MaterialIcons.ttf</string>
        <string>Octicons.ttf</string>
        <string>SimpleLineIcons.ttf</string>
        <string>Zocial.ttf</string>
    </array>
    <key>UILaunchStoryboardName</key>
    <string>LaunchScreen</string>
    <key>UIRequiredDeviceCapabilities</key>
    <array>
        <string>armv7</string>
    </array>
    <key>UIRequiresFullScreen</key>
    <true/>
    <key>UISupportedInterfaceOrientations</key>
    <array>
        <string>UIInterfaceOrientationPortrait</string>
    </array>
    <key>UIViewControllerBasedStatusBarAppearance</key>
    <false/>
</dict>
</plist>

4 个答案:

答案 0 :(得分:0)

请执行以下步骤以在React Native iOS App中将方向锁定为纵向:

1] Open Your_React_Native_Project -> go to ios -> project_name.xcodeproj file in X-Code.
2] After opening the project in Xcode, select your project name.
3] Now Goto -> General -> Deployment Info and select device orientation as portrait.
4] Execute the "react-native run-ios" command and compile the entire project. Now you can see the effect.

还发现,如果将“设备”设置为“通用”,则方向锁定在iPad上似乎不起作用。如果将其更改为iPad,则可以正常工作。

答案 1 :(得分:0)

最后,我找到了答案。这不是我所期望的解决方案,因为我认为通过锁定XCode就足够了,就像我之前在问问中提到的那样,但至少可以奏效。

我安装了react-native-orientation,并在Orientation.lockToPortrait()文件的构造函数中应用了App.js函数,并将应用锁定为纵向模式。

希望对您有所帮助!

答案 2 :(得分:0)

我也遇到了同样的问题,事实证明,原因是由于我的AppDelegate.m中配置了react-native-orientation。

如果我取消注释这2个配置

#import "Orientation.h"

- (UIInterfaceOrientationMask)application:(UIApplication *)application supportedInterfaceOrientationsForWindow:(UIWindow *)window {return [Orientation getOrientation];}

然后正常工作。但是,如果您使用的是本机定向,则必须进行这些配置。所以我认为最终的解决方案是使用Orientation.lockToPortrait()

答案 3 :(得分:-1)

尝试清理项目,重建应用程序,也许有帮助。一旦我无法锁定设备方向,唯一的方法就是勾选“纵向”选项。