Özet - Platform
- React Native kursu
- Başlangıç
- Ders 105/116
- 5 dk
Platform.OS, select ve dosya uzantısını birleştirerek platform uyumlu bir bileşen yazarsın.
Özet - Platform
Bu grupta platforma özgü kod yazmanın yollarını öğrendin. Platform.OS ile hangi platformda olduğunu okursun; Platform.Version ile işletim sistemi sürümünü kontrol edersin. Platform.select ise platforma göre değer veya bileşen seçmenin kısa yoludur.
Dosya uzantısı yöntemiyle .ios.js ve .android.js dosyaları otomatik yüklenir; içe aktarırken uzantı yazmazsın. Şimdi bu kavramları bir araya getiren alıştırmalar yapalım.
Uygulama Sıra sende: platforma özgü dolgu
Platform'u içe aktar. padding değişkenini Platform.select({ ios: 24, android: 18 }) sonucuna eşitle.
Başlangıç kodu
import { Platform } from 'react-native';
// padding'i Platform.select ile ayarla
const padding = null;Örnek çözüm
import { Platform } from 'react-native';
const padding = Platform.select({
ios: 24,
android: 18,
});Uygulama Sıra sende: platforma göre bileşen göster
Platform ve Text'i içe aktar. Eğer Platform.OS === 'ios' ise <Text>iOS</Text> döndür; değilse <Text>Android</Text> döndür.
Başlangıç kodu
import { Text } from 'react-native';
function Screen() {
// platformu kontrol et
return <Text>Cihaz</Text>;
}Örnek çözüm
import { Platform, Text } from 'react-native';
function Screen() {
if (Platform.OS === 'ios') {
return <Text>iOS</Text>;
}
return <Text>Android</Text>;
}Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Platform.OS ne döndürür?
Platform.OS- Bir sayı
- 'ios' veya 'android' dizesi Doğru cevap
- Bir bileşen
- Bir dizi
Açıklama: Platform.OS 'ios' veya 'android' döndürür.
2 Eşleştir: özellik ve görevi
| Kavram | Anlamı |
|---|---|
Platform.OS |
platform adı |
Platform.select |
değer seçme |
Platform.Version |
sürüm numarası |