Saltar al contenido principal

DynamicColorIOS

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 →

La función DynamicColorIOS es un tipo de color específico de la plataforma iOS.

tsx
DynamicColorIOS({
  light: color,
  dark: color,
  highContrastLight: color, // (optional) will fallback to "light" if not provided
  highContrastDark: color, // (optional) will fallback to "dark" if not provided
});

DynamicColorIOS toma un único argumento como objeto con dos claves obligatorias: dark y light, y dos claves opcionales: highContrastLight y highContrastDark. Estas corresponden a los colores que deseas usar para el "modo claro" y "modo oscuro" en iOS, y cuando está habilitado el modo de accesibilidad de alto contraste, las versiones de alto contraste de estos colores.

Durante la ejecución, el sistema elegirá qué color mostrar según la apariencia actual del sistema y la configuración de accesibilidad. Los colores dinámicos son útiles para colores de marca u otros colores específicos de la aplicación que siguen respondiendo automáticamente a los cambios en la configuración del sistema.

Notas para desarrolladores​

información

If you’re familiar with @media (prefers-color-scheme: dark) in CSS, this is similar! Only instead of defining all the colors in a media query, you define which color to use under what circumstances right there where you're using it. Neat!

Ejemplo​

tsx
import {DynamicColorIOS} from 'react-native';

const customDynamicTextColor = DynamicColorIOS({
  dark: 'lightskyblue',
  light: 'midnightblue',
});

const customContrastDynamicTextColor = DynamicColorIOS({
  dark: 'darkgray',
  light: 'lightgray',
  highContrastDark: 'black',
  highContrastLight: 'white',
});