Platform and Platform.select

Platform.OS is 'android' or 'ios' (or 'web', 'windows', 'macos' on the out-of-tree platforms), and Platform.Version is the Android API level as a number or the iOS version as a string. Platform.constants adds details: Release, Brand, Model, Manufacturer and uiMode on Android, osVersion and interfaceIdiom on iOS, plus reactNativeVersion on both; Platform.isPad, isTV and isVision classify the device. Platform.select() picks a value by platform, trying the platform's own key, then native, then default:

src/info/PlatformInfo.tsx: platform facts and a per-platform shadow (excerpt)TSX

const shadow = Platform.select({
  ios: { shadowColor: '#000', shadowOpacity: 0.2, shadowRadius: 6 },
  android: { elevation: 4 },
  default: { boxShadow: '0 2px 6px rgba(0,0,0,0.2)' },
});
// ...inside the component, where Android's constants are cast to their documented fields:
    console.log(`${Platform.OS} ${Platform.Version} (Android ${Release}), ${Brand} ${Model}, `
      + `uiMode ${uiMode}, isTV ${Platform.isTV}`);

Output

 LOG  android 36 (Android 16), google sdk_gphone64_x86_64, uiMode normal, isTV false
 LOG  shadow style: {"elevation":4}

For bigger differences, split the file: Metro resolves BookRow.android.tsx and BookRow.ios.tsx from an import of ./BookRow, and .native.tsx against .web.tsx in the same way, so each bundle contains only its platform's code. Branch on capabilities rather than version numbers where you can, and never use Platform.OS for layout decisions that depend on size (Tablets and Foldables).

MENU

Platform and Platform.select