Jak píšete kód specifický pro konkrétní platformu v React Native?

Question

Accepted Answer

Přestože React Native sdílí většinu kódu mezi iOS a Androidem, někdy potřebujete **kód nebo stylování specifické pro platformu** — pro různé chování platformy, designy nebo možnosti. React Native k tomu poskytuje modul **Platform** a přípony specifické pro platformu.

## Modul Platform

```jsx
import { Platform } from 'react-native';

// check the current platform
if (Platform.OS === 'ios') { /* iOS-specific */ }
else if (Platform.OS === 'android') { /* Android-specific */ }

// Platform.select — pick a value per platform
const styles = {
  padding: Platform.OS === 'ios' ? 20 : 16,
  ...Platform.select({
    ios: { fontFamily: 'Helvetica' },
    android: { fontFamily: 'Roboto' },
  }),
};
```

`Platform.OS` kontroluje platformu; `Platform.select` vybírá hodnoty pro každou platformu — pro podmíněné chování a stylování.

## Soubory specifické pro platformu

```text
→ Create separate files per platform using extensions:
  Button.ios.js   → used on iOS
  Button.android.js → used on Android
  import Button from './Button'   → RN automatically picks the right file per platform
→ Good for substantially different platform implementations (cleaner than lots of if-checks)
```

## Kdy a jak to používat

```text
✓ Use platform-specific code SPARINGLY — share code by default; diverge only when needed
✓ Common reasons: platform design conventions (iOS vs Material), platform-specific
  features/APIs, behavior differences, platform-appropriate UX
✓ Platform module for small differences; .ios/.android files for large differences
✓ Test on BOTH platforms (a feature working on one may differ/break on the other)
```

## Proč je to důležité

Rozmět, jak psát kód specifický pro platformu, je cenné, protože **i multiplatformní aplikace někdy potřebují chování nebo stylování specifické pro platformu**, a správné řešení je užitečná praktická znalost pro reálné aplikace React Native.

Přestože hodnota React Native spočívá ve sdílení většiny kódu mezi iOS a Androidem, reálné aplikace někdy potřebují **divergovat pro každou platformu** — kvůli konvencím platformy (iOS vs Android/Material estetice), funkcím nebo API specifickým pro platformu, rozdílům v chování nebo uživatelské zkušenosti vhodné pro platformu — a pochopení, jak se s tím vypořádat, je důležité.

Modul **Platform** (`Platform.OS` pro kontrolu platformy a `Platform.select` pro výběr hodnot pro každou platformu) zvládá malé rozdíly přímo — podmíněné chování a stylování. **Soubory specifické pro platformu** (s příponami `.ios.js` a `.android.js`, které React Native automaticky vybere správný soubor) čistě zvládají větší rozdíly (oddělené implementace spíše než mnoho podmínek).

Porozumění **kdy a jak toto používat** odráží dobrý úsudek: používání kódu specifického pro platformu **zřídka** (sdílení kódu ve výchozím stavu a divergence pouze když je to opravdu potřeba — zachování výhody multiplatformnosti React Native), výběr modulu Platform pro malé rozdíly oproti souborům specifickým pro platformu pro velké rozdíly a zásadně **testování na obou platformách** (protože funkce fungující na jedné se může na druhé lišit nebo selhat — běžný reálný problém).

Tento vyvážený přístup (sdílení ve výchozím stavu, promyšlená divergence když je potřeba, testování obou) odráží zralý multiplatformní vývoj.

Požadavku multiplatformních aplikací někdy oprávněně potřebovat kód specifický pro platformu (pro konvence, funkce nebo uživatelskou zkušenost) a jeho správné řešení (správné nástroje používané zřídka, s testováním na obou platformách) je důležité pro kvalitní aplikace, a jelikož pochopení modulu Platform a souborů specifických pro platformu to umožňuje, je pochopení, jak psát kód specifický pro platformu v React Native, cenná a prakticky relevantní znalost — užitečná pro zvládání rozdílů mezi platformami, které se v reálných aplikacích objevují, a zároveň zachování sdílení kódu multiplatformního, která činí React Native cenným a odráží promyšlený multiplatformní vývoj.