CODEWITHSUNDEEP
javascriptcssreactjsreact-nativelayout
Jasur Kurbanov
Jasur Kurbanov

Reputation: 830

Draw vertical dotted line in react native

See image

Can anyone suggest how to do these dotted vertical lines between icons in React Native?

Upvotes: 4

Views: 10322

Answers (1)

Lenoarod
Lenoarod

Reputation: 3610

firstly, you can search for the third library, if you want more style. I find the react-native-dash library. you can use like the following:

 <Dash dashGap={3} style={{width:1, height:100, flexDirection:'column',}}/>

then, if you want to define a component by yourself, you can use the style, and put it in the pure component

export const DotLine = (props) => {

  return({
     <View style={{
        borderStyle: 'dotted',
        height:200,
        borderLeftWidth:5
       }}/>

   })

}

//then use it in other components
<Icon/><DotLine/><Icon/>

Upvotes: 8

Related Questions