Platform Targeting - jellyfish-tom/TIL GitHub Wiki
How can you write different code for IOS and Android in the same code base ? Is there any module available for this ?
The platform module detects the platform in which the app is running.
import { Platform, Stylesheet } from 'react-native';
const styles = Stylesheet.create({
height: Platform.OS === 'IOS' ? 200 : 400
})
Additionally Platform.select method available that takes an object containing Platform.OS as keys and returns the value for the platform you are currently on.
import { Platform, StyleSheet } from 'react-native';
const styles = StyleSheet.create({
container: {
flex: 1,
...Platform.select({
ios: {
backgroundColor: 'red',
},
android: {
backgroundColor: 'green',
},
default: {
// other platforms, web for example
backgroundColor: 'blue',
},
}),
},
});
Another method is to name files like name_of_the_file.ios.js for that file to only be added to IOS bundle and analogically
name_of_the_file.android.js will only be added to Android bundle.