Przejdź do treści głównej
Wersja: Następna

DynamicColorIOS

Nieoficjalne Tłumaczenie Beta

Ta strona została przetłumaczona przez PageTurner AI (beta). Nie jest oficjalnie zatwierdzona przez projekt. Znalazłeś błąd? Zgłoś problem →

Funkcja DynamicColorIOS to specyficzny dla iOS typ koloru platformy.

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 przyjmuje pojedynczy argument w formie obiektu z dwoma obowiązkowymi kluczami: dark i light, oraz dwoma opcjonalnymi kluczami highContrastLight i highContrastDark. Odpowiadają one kolorom, które chcesz używać w trybie "jasnym" i "ciemnym" na iOS oraz ich wersjom wysokokontrastowym, gdy włączony jest tryb wysokiego kontrastu dostępności.

W czasie działania system wybierze, który kolor wyświetlić w zależności od aktualnego wyglądu systemu i ustawień dostępności. Kolory dynamiczne są przydatne dla kolorów brandingowych lub innych specyficznych dla aplikacji kolorów, które nadal automatycznie reagują na zmiany ustawień systemowych.

Uwagi dla deweloperów​

informacja

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!

Przykład​

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

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

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