Introducing React Native styles
It’s time to implement your first React Native app, beyond the boilerplate that’s generated by Expo. I want to make sure that you feel comfortable using React Native style sheets before you start implementing Flexbox layouts in the next section.
Here’s what a React Native style sheet looks like:
import { Platform, StyleSheet, StatusBar } from "react-native";
export default StyleSheet.create({
container: {
flex: 1,
justifyContent: "center",
alignItems: "center",
backgroundColor: "ghostwhite",
...Platform.select({
ios: { paddingTop: 20 },
android: { paddingTop: StatusBar.currentHeight },
}),
},
box: {
width: 100,
height: 100,
justifyContent: "center",
alignItems: "center",
backgroundColor: "lightgray",
},
boxText: {
color: "darkslategray",
fontWeight: "bold",
...