我正在开发基于反应原生方向的示例应用程序。实际上,方向是有效的。当我去一个特定的页面时,我想要横向模式。这没有问题,在这种情况下显示横向模式,但是当我尝试设备时转向纵向模式。但是当我转向肖像或风景我想要显示只有风景不是肖像。
我正在使用此模块并编写此代码:
var Orientation = require(' react-native-orientation');
class XOrating extends React.Component {
constructor(props){
super(props);
this.state={
HEIGHT:667,
WIDTH:375
}
}
componentWillMount(){
if(this.props.sportName == 'Pro Football'){
Orientation.lockToLandscape();
this.setState({
HEIGHT:375,
WIDTH:667
})
}
else{
Orientation.lockToPortrait();
}
}
_orientationDidChange(orientation) {
if (orientation == 'LANDSCAPE') {
Orientation.lockToLandscape();
//do something with landscape layout
} else if(orientation == 'PORTRAIT') {
//do something with portrait layout
Orientation.lockToLandscape();
}
}
componentWillUnmount() {
Orientation.getOrientation((err,orientation)=> {
console.log("Current Device Orientation: ", orientation);
});
Orientation.removeOrientationListener(this._orientationDidChange);
}
componentDidMount(){
Orientation.addOrientationListener(this._orientationDidChange);
}
render(){
return(
<Image source={{uri:this.state.ImgBackground}} style={{width:this.state.WIDTH,
height:this.state.HEIGHT, top:0, left:0}}>
)
}
module.exports = XOrating;
在自动旋转中隐藏设备时,请建议我想要适合横向模式
答案 0 :(得分:0)
是的,最后我得到了我正在做的错误......
我只是在AppDelegate.m文件中添加两行,然后清理x代码并运行。
#import "../../node_modules/react-native-orientation/iOS/RCTOrientation/Orientation.h"
- (UIInterfaceOrientationMask)application:(UIApplication *)application supportedInterfaceOrientationsForWindow:(UIWindow *)window {
return [Orientation getOrientation];
}