Scribd Logo
Upload

Welcome to Scribd!

  • React Native Cheat Sheet

    Uploaded by

    Kike Santana
    709 views12 pages
    The document is a cheat sheet for React Native layout properties. It outlines different flexbox properties for controlling layout including flexDirection, justifyContent, alignItems and their possible values like 'row', 'column', 'flex-start', 'center' etc. It also covers flex properties, alignSelf, aspectRatio, flexWrap and positioning with relative and absolute.

    Original Description:

    Snippets of react Native

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    The document is a cheat sheet for React Native layout properties. It outlines different flexbox properties for controlling layout including flexDirection, justifyContent, alignItems and their possible values like 'row', 'column', 'flex-start', 'center' etc. It also covers flex properties, alignSelf, aspectRatio, flexWrap and positioning with relative and absolute.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    709 views12 pages

    React Native Cheat Sheet

    Uploaded by

    Kike Santana
    The document is a cheat sheet for React Native layout properties. It outlines different flexbox properties for controlling layout including flexDirection, justifyContent, alignItems and their possible values like 'row', 'column', 'flex-start', 'center' etc. It also covers flex properties, alignSelf, aspectRatio, flexWrap and positioning with relative and absolute.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 12

    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    justify align

    relative absolute items content

    ‘column’/’column-reverse’/’row’/’row-reverse’

    flexDirection column

    1 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    flex

    2 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    flex:1

    flex

    flex:1 flex:1

    flex:2 flex:3

    ‘flex-start’/’flex-end’/’center’/’space-between’/’space-around’

    3 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    flex-start

    ‘flex-start’, ‘flex-end’, ‘center’, ‘stretch’

    4 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    stretch width

    width flex-start flex-end

    5 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    ‘flex-start’, ‘flex-end’, ‘center’, ‘stretch’

    6 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    ‘wrap’, ‘nowrap’

    nowrap

    ‘flex-start’/’center’/’flex-end’/’stretch’/’space-between’/’space-

    around’

    flexWrap:'wrap'

    7 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    ‘relative’/’absolute’

    relative

    absolute

    8 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    relative

    9 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    10 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    11 of 12 8/15/2018, 12:03 PM
    The Full React Native Layout Cheat Sheet – Dror Biran – Medium https://medium.com/@drorbiran/the-full-react-native-layout-cheat-sheet...

    12 of 12 8/15/2018, 12:03 PM

    You might also like