Nondeterministic Palindrome Machine

    react-native-view

    1.1.0 • Public • Published

    react-native-view

    A lightweight View component that can be styled quickly.

    Installation

    $ npm install react-native-view --save

    then

    import View from 'react-native-view';
    /*...*/
    <View vcenter hcenter>
    /*...*/
    </View>

    Usage

    Align content

    Example

    • ##### center children horizontally
    <View hcenter>
    /*...*/
    </View>

    alt text

    • ##### align children to the left
    <View hstart>
    /*...*/
    </View>

    alt text

    • ##### center children horizontally and vertically
    <View vcenter hcenter>
    /*...*/
    </View>

    alt text

    Available props:

    prop description
    hstart Align children to the left
    hcenter Center children horizontally
    hend Align children to the right
    vstart Align children to the top
    vcenter Center children vertically
    vend Align children to the bottom
    flex Apply flex: 1
    row Becomes a row (column by default)
    stretch Stretch the view to fill parent
    spread Spread children evenly along the orientation with padding
    push Spread children evenly along the orientation without padding

    More examples:

    • ##### spread
    <View spread hcenter>
    /*...*/
    </View>

    alt text

    • ##### push
    <View push hcenter>
    /*...*/
    </View>

    alt text

    Padding

    By default paddings can be set using breakpoints:

    name value in px
    sm 5
    md 15
    lg 30
    xl 45

    Also, you can specify where paddings are applied using directional suffixes: l - left | r - right | t - top | b - bottom:

    Example

    • #### 15px padding top and left
    <View mdpt mdpl>
    </View>

    alt text

    • #### 5px padding on all sides
    <View smp>
    </View>

    alt text

    License

    MIT

    Install

    npm i react-native-view

    DownloadsWeekly Downloads

    14

    Version

    1.1.0

    License

    MIT

    Last publish

    Collaborators

    • i6mi6