آپ React Native میں platform-specific کوڈ کیسے لکھتے ہیں؟

Question

Accepted Answer

اگرچہ React Native iOS اور Android میں زیادہ تر کوڈ شیئر کرتا ہے، کبھی کبھی آپ کو **platform-specific** کوڈ یا styling کی ضرورت ہوتی ہے — مختلف platform رویے، designs، یا capabilities کے لیے۔ React Native اس کے لیے **Platform** module اور platform-specific فائل extensions فراہم کرتا ہے۔

## Platform module

```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` platform کو چیک کرتا ہے؛ `Platform.select` ہر platform کے لیے values منتخب کرتا ہے — conditional رویے اور styling کے لیے۔

## Platform-specific فائلیں

```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)
```

## اسے کب اور کیسے استعمال کریں

```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)
```

## اہمیت کیوں ہے

Platform-specific کوڈ لکھنے کا طریقہ سمجھنا قیمتی ہے کیونکہ **یہاں تک کہ cross-platform apps کو بھی کبھی کبھی platform-specific رویے یا styling کی ضرورت ہوتی ہے**، اس لیے اسے صحیح طریقے سے سنبھالنا حقیقی React Native ایپلیکیشنز کے لیے مفید عملی علم ہے۔

اگرچہ React Native کی قدر iOS اور Android میں زیادہ تر کوڈ شیئر کرنے میں ہے، حقیقی ایپس کبھی کبھی ہر platform میں **منحرف** ہونے کی ضرورت ہوتی ہے — platform design conventions (iOS بمقابلہ Android/Material aesthetics)، platform-specific features یا APIs، رویے میں فرق، یا platform-مناسب UX کے لیے — اور اس کو سنبھالنے کا طریقہ سمجھنا اہم ہے۔

**Platform module** (`Platform.OS` platform کو چیک کرنے اور `Platform.select` ہر platform کے لیے values منتخب کرنے کے لیے) چھوٹے فرق کو inline میں سنبھالتا ہے — conditional رویے اور styling۔ **Platform-specific فائلیں** (`.ios.js` اور `.android.js` extensions استعمال کرتے ہوئے، React Native خود بخود صحیح فائل منتخب کرتا ہے) بڑے فرق کو صاف ستھرا سے سنبھالتی ہیں (بہت سارے conditionals کی بجائے الگ implementations)۔

**کب اور کیسے ان کو استعمال کریں** یہ سمجھنا اچھے فیصلے کو ظاہر کرتا ہے: platform-specific کوڈ کو **شاذ و نادر** استعمال کرنا (ڈیفالٹ طور پر کوڈ شیئر کرنا اور صرف تب ہی منحرف ہونا جب واقعی ضروری ہو — React Native کے cross-platform فائدے کو محفوظ رکھنا)، چھوٹے فرق کے لیے Platform module منتخب کرنا بمقابلہ بڑے فرق کے لیے platform-specific فائلوں، اور اہم طور پر **دونوں platforms پر ٹیسٹ کرنا** (کیونکہ ایک platform پر کام کرنے والی feature دوسرے پر مختلف ہو سکتی ہے یا ٹوٹ سکتی ہے — ایک عام حقیقی مسئلہ)۔

yہ متوازن نقطہ نظر (ڈیفالٹ طور پر شیئر کریں، سوچ سمجھ کر منحرف ہوں جب ضروری ہو، دونوں کو ٹیسٹ کریں) بالغ cross-platform development کو ظاہر کرتا ہے۔

چونکہ cross-platform apps کبھی کبھی شرعی طور پر platform-specific کوڈ کی ضرورت ہوتی ہے (conventions، features، یا UX کے لیے) اور اسے اچھی طرح سنبھالنا (صحیح tools کو شاذ و نادر استعمال کرنا، دونوں platforms پر ٹیسٹ کرنا) معیاری ایپلیکیشنز کے لیے اہم ہے، اور چونکہ Platform module اور platform-specific فائلوں کو سمجھنا یہ ممکن بناتا ہے، React Native میں platform-specific کوڈ لکھنے کا طریقہ سمجھنا قیمتی، عملی طور پر متعلقہ علم ہے — platform فرق کو سنبھالنے کے لیے مفید جو حقیقی ایپس میں پیدا ہوتے ہیں جبکہ cross-platform code-sharing کو محفوظ رکھتے ہیں جو React Native کو قیمتی بناتا ہے، thoughtful cross-platform development کو ظاہر کرتے ہوئے۔