→ React Native에서는 iOS와 Android 각각에 대해 CSS 스타일을 지정할 수 있다.
현재 프로젝트에서도 iOS와 Android 둘다 고려하여 출시할 것이다. 이를 위해 React Native에서는 Platform API
를 사용하여 현재 실행 중인 플랫폼을 확인하고 해당 플랫폼에 특정한 스타일을 적용할 수 있는 것이다.
1) Platform.OS를 사용하여 현재 실행 중인 플랫폼을 확인한다.
2) Platform.OS는 'ios' 또는 'android' 값을 가진다.
3) 해당 플랫폼에 따라 스타일을 다르게 지정한다.
//예시 코드
import { Platform, StyleSheet } from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: Platform.OS === 'ios' ? 'lightgray' : 'lightblue',
},
text: {
fontSize: Platform.OS === 'ios' ? 20 : 16,
color: Platform.OS === 'ios' ? 'black' : 'white',
},
});