Orientation help

#1

Hi,

I would like my app to remain to Portrait mode apart from one page where i want to force it to be Landscape.
In my app.json i have:

{
  "expo": {
    "sdkVersion": "23.0.0",
    "orientation": "portrait"
  }
}

On the page where i want to force landscape i have:
Expo.ScreenOrientation.allow(Expo.ScreenOrientation.Orientation.LANDSCAPE_RIGHT);

However, this is setting the whole application to Landscape instead of just the desired view.

I have put:
Expo.ScreenOrientation.allow(Expo.ScreenOrientation.Orientation.PORTRAIT);
On the page it returns to but this has no effect.

Am i missing something?

Thanks
James

#2

hi @jreason, afaik the runtime orientation api will run on the entire application screen and not meant to occur in a particular view. Could you put a basic reproduction into a snack (snack.expo.io)?

#3

is there a way to do this in a particular view? cc: @janic

#4

Currently the only way to do that is to use the ScreenOrientation API like you mentioned. I think the issue is simply that the code in the screen you return to doesn’t get called because of the way stack navigation works. I think the best way to do what you want is to use componentDidMount and componentWillUnmount in the screen that has the different orientation.

class LandscapeScreen extends Component {
  componentDidMount() {
    Expo.ScreenOrientation.allow(Expo.ScreenOrientation.Orientation.LANDSCAPE_RIGHT);
  }

  componentWillUnmount() {
    Expo.ScreenOrientation.allow(Expo.ScreenOrientation.Orientation.PORTRAIT);
  }

  render() { ... }
}

I think it would be nice to provide a more declarative API, maybe something like React Native’s StatusBar.

2 Likes
#5

@quinlanj @janic thanks both, the code provided has done the trick!

One thing i have noticed though, when using LANDSCAPE_RIGHT, i would except the screen to render the same way on both iOS and Android, however, the screen goes one way on iOS and the other way on Android?

closed #6

This topic was automatically closed 20 days after the last reply. New replies are no longer allowed.