https://github.com/chirag04/react-native-dashed-border

A <DashedBorder> element for react-native
https://github.com/chirag04/react-native-dashed-border

Last synced: 2 months ago
JSON representation

A <DashedBorder> element for react-native

• Host: GitHub
• URL: https://github.com/chirag04/react-native-dashed-border
• Owner: chirag04
• Created: 2015-05-07T17:41:37.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2016-02-08T16:41:19.000Z (almost 9 years ago)
• Last Synced: 2024-11-02T03:11:44.551Z (2 months ago)
• Language: Objective-C
• Size: 13.7 KB
• Stars: 40
• Watchers: 2
• Forks: 5
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-react-native - react-native-dashed-border ★33 - A element for react-native (Components / UI)
• awesome-reactnative-ui - react-native-dashed-border - native|<ul><li>Last updated : This week</li><li>Stars : 35</li><li>Open issues : 1</li></ul>|| (Others)
• awesome-react-native - react-native-dashed-border ★33 - A element for react-native (Components / UI)
• awesome-reactnative-ui - react-native-dashed-border - native|<ul><li>Last updated : This week</li><li>Stars : 35</li><li>Open issues : 1</li></ul>|| (Others)
• awesome-react-native - react-native-dashed-border ★33 - A element for react-native (Components / UI)
• awesome-react-native-ui - react-native-dashed-border ★23 - A element for react-native (Components / UI)
• awesome-react-native - react-native-dashed-border ★33 - A element for react-native (Components / UI)

README

        
#DEPRECATED

dashed border already works on react native 0.19+. Use `style : { borderStyle: 'dashed' }` in your stylesheet. 

# react-native-dashed-border

Very simple native component that gives you dashed borders. Copied from brentvatne example [here](https://github.com/brentvatne/react-native-dashed-border-example)

### Add it to your ios project

1. Run `npm install react-native-dashed-border --save`

2. Open your project in XCode, right click on `Libraries` and click `Add

   Files to "Your Project Name"` [(Screenshot)](http://url.brentvatne.ca/jQp8) then [(Screenshot)](http://url.brentvatne.ca/1gqUD).

3. Add `libRNDashedBorder.a` to `Build Phases -> Link Binary With Libraries`

   [(Screenshot)](http://url.brentvatne.ca/17Xfe).

4. Whenever you want to use it within React code now you can: `var DashedBorder = require('react-native-dashed-border');`

### Add it to your android project

Just ``npm install react-native-dashed-border`` and require should work.

### Note

1. lineDashPattern is not supported on android.

## Example

```javascript

var React = require('react-native');

var DashedBorder = require('react-native-dashed-border');

var DashedBorderExampleApp = React.createClass({

  render: function() {

    return (

      

        

      

    );

  }

});

```

![Demo](https://raw.githubusercontent.com/brentvatne/react-native-dashed-border-example/master/example.png)