Plataforma

Traducción Beta No Oficial

Esta página fue traducida por PageTurner AI (beta). No está respaldada oficialmente por el proyecto. ¿Encontraste un error? Reportar problema →

Ejemplo

---

Referencia

Propiedades

constants

tsx

static constants: PlatformConstants;

Devuelve un objeto que contiene todas las constantes comunes y específicas disponibles relacionadas con la plataforma.

Propiedades:

Name	Type	Optional	Description
isTesting	boolean	No
reactNativeVersion	object	No	Information about React Native version. Keys are major, minor, patch with optional prerelease and values are numbers.
Version Android	number	No	OS version constant specific to Android.
Release Android	string	No
Serial Android	string	No	Hardware serial number of an Android device.
Fingerprint Android	string	No	A string that uniquely identifies the build.
Model Android	string	No	The end-user-visible name for the Android device.
Brand Android	string	No	The consumer-visible brand with which the product/hardware will be associated.
Manufacturer Android	string	No	The manufacturer of the Android device.
ServerHost Android	string	Yes
uiMode Android	string	No	Possible values are: 'car', 'desk', 'normal','tv', 'watch' and 'unknown'. Read more about Android ModeType.
forceTouchAvailable iOS	boolean	No	Indicate the availability of 3D Touch on a device.
interfaceIdiom iOS	string	No	The interface type for the device. Read more about UIUserInterfaceIdiom.
osVersion iOS	string	No	OS version constant specific to iOS.
systemName iOS	string	No	OS name constant specific to iOS.

---

isPad

iOS

tsx

static isPad: boolean;

Devuelve un booleano que define si el dispositivo es un iPad.

Type
boolean

---

isTV

tsx

static isTV: boolean;

Devuelve un booleano que define si el dispositivo es una TV.

Type
boolean

---

isVision

tsx

static isVision: boolean;

Devuelve un booleano que define si el dispositivo es un Apple Vision. Si usas Apple Vision Pro (Diseñado para iPad) isVision será false pero isPad será true

Type
boolean

---

isTesting

tsx

static isTesting: boolean;

Devuelve un booleano que define si la aplicación se está ejecutando en Modo Desarrollador con el flag de pruebas activado.

Type
boolean

---

OS

tsx

static OS: 'android' | 'ios';

Devuelve un valor de cadena que representa el sistema operativo actual.

Type
enum('android', 'ios')

---

Version

tsx

static Version: 'number' | 'string';

Devuelve la versión del sistema operativo.

Type
number Android string iOS

Métodos

select()

tsx

static select(config: Record<string, T>): T;

Devuelve el valor más adecuado para la plataforma en la que se está ejecutando actualmente.

Parámetros:

Name	Type	Required	Description
config	object	Yes	See config description below.

El método select devuelve el valor más adecuado para la plataforma actual. Es decir, si se ejecuta en un teléfono, tendrán prioridad las claves android e ios. Si no están especificadas, se usará la clave native y luego la clave default.

El parámetro config es un objeto con las siguientes claves:

• android (cualquier tipo)

• ios (cualquier tipo)

• native (cualquier tipo)

• default (cualquier tipo)

Ejemplo de uso:

tsx

import {Platform, StyleSheet} from 'react-native';

const styles = StyleSheet.create({
  container: {
    flex: 1,
    ...Platform.select({
      android: {
        backgroundColor: 'green',
      },
      ios: {
        backgroundColor: 'red',
      },
      default: {
        // other platforms, web for example
        backgroundColor: 'blue',
      },
    }),
  },
});

Esto resultará en un contenedor con flex: 1 en todas las plataformas, fondo verde en Android, fondo rojo en iOS y fondo azul en otras plataformas.

Dado que el valor de la clave de plataforma correspondiente puede ser de tipo any, el método select también puede usarse para devolver componentes específicos de plataforma, como se muestra a continuación:

tsx

const Component = Platform.select({
  ios: () => require('ComponentIOS'),
  android: () => require('ComponentAndroid'),
})();

<Component />;

tsx

const Component = Platform.select({
  native: () => require('ComponentForNative'),
  default: () => require('ComponentForWeb'),
})();

<Component />;