I
I
Ilya2019-05-09 15:02:27
React Native
Ilya, 2019-05-09 15:02:27

How to make Screen Orientation?

Good afternoon, how to check the screen orientation?
I use:
import { ScreenOrientation } from 'expo';
That is, when the device makes a turn, ScreenOrientation is triggered.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
I
Ilya, 2019-05-09
@ynizhenie

Decision:

import { Component } from 'react';
import PropTypes from 'prop-types';
import Expo from 'expo';
import { expo } from '../app.json';

const ORIENTATION_DEFAULT = Expo.ScreenOrientation.Orientation.ALL;
const ORIENTATIONS = {
  'portrait': Expo.ScreenOrientation.Orientation.PORTRAIT,
  'landscape': Expo.ScreenOrientation.Orientation.LANDSCAPE,
  'default': ORIENTATION_DEFAULT,
};

export default class ScreenOrientation extends Component {
  allow(orientation) {
    const key = orientation === 'default' ? expo.orientation : orientation;
    Expo.ScreenOrientation.allow(ORIENTATIONS[key] || ORIENTATION_DEFAULT);
  }

  componentDidMount() {
    this.allow(this.props.allow);
  }

  componentWillUnmount() {
    this.allow('default');
  }

  render() {
    return this.props.children;
  }
}

ScreenOrientation.propTypes = {
  children: PropTypes.node,
  allow: PropTypes.oneOf(Object.keys(ORIENTATIONS)),
};

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question