反应原生取向实施示例需要

Question

我是反应原生新的。我在ios实现方向时遇到问题。我正在尝试使用反应原生方向。我已阅读文档，但无法执行。请不要用“lockToPortrait（），lockToLandscape（）或getOrientation（function（err，orientation））等方法来回答，我已经阅读过了。任何人都可以用一段工作代码做出响应，这对我来说就足够了。

感谢

Answer 1

var Orientation = require('react-native-orientation'); 

class YourApp extends Component { 
    componentDidMount() { 
     Orientation.lockToPortrait(); 
    } 
    render() { 
     <MainComponent /> 
    } 
} 

AppRegistry.registerComponent('YourApp',() => YourApp); 

为我工作就好了。

Answer 2

import React, {PureComponent} from 'react'; 
 
import { 
 
    View, 
 
    Text, 
 
    Dimensions 
 
} from 'react-native'; 
 
import Orientation from 'react-native-orientation'; 
 

 

 
const { 
 
    width: deviceScreenWidth, 
 
    height: deviceScreenHeight 
 
} = Dimensions.get('window'); 
 

 
let aspectRatio = deviceScreenWidth/deviceScreenHeight; 
 
export default class Home extends PureComponent { 
 
    constructor(props) { 
 
     super(props); 
 
    } 
 

 

 
    render() { 
 
     return (
 
      <View style={style.homeMainContainer}> 
 
       <Text>Atif dont let this screen rotate</Text> 
 
      </View> 
 
     ) 
 
    }// end of render 
 

 
    componentDidMount() { 
 

 
     if (deviceScreenWidth > deviceScreenHeight) { 
 
      Orientation.lockToLandscape(); 
 
     } else { 
 
      Orientation.lockToPortrait(); 
 
     } 
 

 
     // this unlocks any previous locks to all Orientations 
 
     // Orientation.unlockAllOrientations(); 
 

 
     Orientation.addOrientationListener(this._orientationDidChange); 
 
    } 
 

 
    _orientationDidChange = (orientation) => { 
 
     if (orientation === 'LANDSCAPE') { 
 
      // do something with landscape layout 
 
     } else { 
 
      // do something with portrait layout 
 
     } 
 
    } 
 

 

 

 
};

这EXA mple是要弄清楚该设备是平板电脑还是移动设备，如果是平板电脑，它将锁定屏幕为横屏，如果是移动设备，则会将屏幕锁定为纵向。

This is the library as package first you have to install the package link : https://www.npmjs.com/package/react-native-orientation