Styled react native components

July 1, 2018 ยท View on GitHub

For easy styling of react native components and its style composition

Read more about this package in this Medium article - Advanced React Native styling with a few lines of code

Usage

  import styled from 'styled-react-native'
  import { Text } from 'react-native'

  const Headline = styled(Text)(() => {
    return {
      fontSize: 20,
      textAlign: 'center',
      margin: 10
    }
  })

  const BoldHeadline = styled(Headline)(() => {
    return {
      fontWeight: 'bold'
    }
  })

or

  import styled from 'styled-react-native'
  import { Text } from 'react-native'

  const Headline = styled(Text)
  <Headline {...{style: {color: 'red'}}} />