Default styles

Some of the components need default styling so that the display of these components appears consistently throughout the app. One such component which need default styling is the Text component. The appearance of normal text throughout the app should be consistent with it's FontFamily, FontSize, FontColor etc.

Using Stylo, the theme can be configured to apply default styles to any React Native component. The StyleName Default is reserved to define the default styles.

const TextStyles = StyleSheet.create({ Default: { color: '#444444', fontSize: 16, fontWeight: '400', lineHeight: 24, }, ... };

Default styled components

Default styles can be applied to following components:

  • 1. Image
  • 2. ImageBackground
  • 3. Pressable
  • 4. SafeAreaView
  • 5. ScrollView
  • 6. Text
  • 7. TextInput
  • 8. TouchableHighlight
  • 9. TouchableOpacity
  • 10. View