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

iOS

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!

Web

The DynamicColorIOS function is similar to the iOS native methods UIColor colorWithDynamicProvider:

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',
});