react-native-dash
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.11 • Public • Published

    react-native-dash

    NPM version

    A super simple <Dash /> component for react-native to draw customisable dashed lines

    Installation

    npm i --save react-native-dash

    Props

    name desc type default
    style Dash container style View.PropTypes.Style {flexDirection = 'row'}
    dashGap Gap between two dashes number 2
    dashLength Length of each dash number 4
    dashThickness Thickness of each dash number 2
    dashColor Color of each dash string black
    dashStyle Dashes style View.PropTypes.Style {}
    • ProTip 1: Use flexDirection in style to get horizontal or vertical dashes. By default, it's row
    • ProTip 2: Use {borderRadius: 100, overflow: 'hidden'} in dashStyle to get rounded dotes instead of straight line dashes.

    Usage

    import Dash from 'react-native-dash';
     
    //draws a horizontal dashed line with defaults. Also works with flex
    render() {
        return <Dash style={{width:100, height:1}}/>
    }
     
    //draws a vertical dashed line with defaults.
    render() {
        return <Dash style={{width:1, height:100, flexDirection:'column'}}/>
    }

    Dependenies

    react-native-measureme

    Development

    PRs highly appreciated

    License

    MIT License

    Install

    npm i react-native-dash

    DownloadsWeekly Downloads

    23,143

    Version

    0.0.11

    License

    MIT

    Unpacked Size

    7.6 kB

    Total Files

    6

    Last publish

    Collaborators

    • obipawan