react-native-device-select

An extension on the React Native Platform utilities that offers some more granular choices that are device specific.

Installation

This library has a peer dependency on react-native-device-info so you will need to install that as well.

npm install react-native-device-info react-native-device-select
# or
yarn add react-native-device-info react-native-device-select

Usage

import { Device } from 'react-native-device-select'

if (Device.isMobile) {
  // mobile device
}

if (Device.isPhone) {
  // phone
}

if (Device.isTablet) {
  // tablet
}

if (Device.isAndroid) {
  // Android device
}

if (Device.isApple) {
  // Apple device
}

if (Device.isTV) {
  // TV device
}

if (Device.isAppleTV) {
  // Apple TV device
}

if (Device.isAndroidTV) {
  // Android TV device
}

Device.select

Just a basic example but all of above utilities are available on Device.select as an option.

import { Device } from 'react-native-device-select'

const styles = StyleSheet.create({
  container: {
    marginVertical: 20,
    ...Device.select({
      phone: {
        marginVertical: 10,
      },
      tablet: {
        marginVertical: 15,
      },
      tv: {
        marginVertical: 0,
      },
    }),
  },
  title: {
    marginTop: 5,
    ...Device.select({
      android: {
        marginTop: 4,
      },
    }),
  },
  signUpButton: {
    fontSize: 14,
    ...Device.select({
      appleTV: {
        display: 'none',
      },
    }),
  }
})

License

MIT