/react-native-view-finder

A flexible little View Finder component to be used in conjunction with react-native-camera

Primary LanguageJavaScriptMIT LicenseMIT

react-native-view-finder

A flexible little View Finder component to be used in conjunction with react-native-camera

npm package version npm downloads standard JS linter prettier code formatting Greenkeeper travis ci build status project license make a pull request

Github Watch Badge Github Star Badge Tweet

Built with ❤︎ by tiaanduplessis and contributors

Table of Contents

Table of Contents
  • Install
  • Usage
  • Contribute
  • License

    • Install

    $ npm install react-native-view-finder
# OR
$ yarn add react-native-view-finder

    Usage

    import {View, StyleSheet} from 'react-native'
import ViewFinder from 'react-native-view-finder'

const Example = () => (
  <View style={styles.container}>
    <ViewFinder backgroundColor="#333" loading />
  </View>
)

const styles = StyleSheet.create({
  container: { flex: 1 }
})

    This will result in:

    Props

    Prop Description Type Defualt
    containerStyle Array Container Styles Array {}
    backgroundColor String for Background color of View Finder. String transparent
    color String for Color of the View finder edges String #FFF
    height Number for Height of View Finder Number 200
    width Number for Width of View Finder Number 200
    borderWidth Number for Border with of View Finder edges Number 3
    borderRadius Number for Border Radius of View Finder edges Number 0
    borderLength Number for Border length of View Finder edges Number 25
    loading Bool for the indicate if loading indicator should be shown Bool false
    loadingColor String for Color of the loading indicator String #FFF
    loadingBelowVF Bool for the indicate if loading indicator should be shown under View Finder Bool false

    Contributing

    Contributions are welcome!

    1. Fork it.
    2. Create your feature branch: git checkout -b my-new-feature
    3. Commit your changes: git commit -am 'Add some feature'
    4. Push to the branch: git push origin my-new-feature
    5. Submit a pull request :D

    Or open up a issue.

    License

    Licensed under the MIT License.