https://github.com/Shuangzuan/react-native-square-view

A square view component for react native.
https://github.com/Shuangzuan/react-native-square-view

Last synced: about 2 months ago
JSON representation

A square view component for react native.

• Host: GitHub
• URL: https://github.com/Shuangzuan/react-native-square-view
• Owner: Shuangzuan
• License: mit
• Created: 2015-06-06T07:47:06.000Z (over 9 years ago)
• Default Branch: master
• Last Pushed: 2017-09-19T14:20:58.000Z (over 7 years ago)
• Last Synced: 2024-04-26T02:35:38.921Z (9 months ago)
• Size: 176 KB
• Stars: 24
• Watchers: 2
• Forks: 5
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-react-native - react-native-square-view ★22 - A square view component for react native. (Components / UI)
• awesome-react-native - react-native-square-view ★22 - A square view component for react native. (Components / UI)
• awesome-reactnative-ui - react-native-square-view - native-square-view/master/screen-shot.png)| (Others)
• awesome-reactnative-ui - react-native-square-view - native-square-view/master/screen-shot.png)| (Others)
• awesome-react-native - react-native-square-view ★22 - A square view component for react native. (Components / UI)
• awesome-react-native-ui - react-native-square-view ★17 - A square view component for react native. (Components / UI)
• awesome-react-native - react-native-square-view ★22 - A square view component for react native. (Components / UI)

README

        
# react-native-square-view

A square view component for react native.

## Screen Shot

![Screen Shot](screen-shot.png)

## Installation

1. Run `npm install react-native-square-view --save` in your project directory.

2. Add `var SquareView = require('react-native-square-view');` to your code.

## Usage

```javascript

'use strict';

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

var {

  AppRegistry,

  StyleSheet,

  Text,

  View,

  ScrollView

} = React;

var SquareView = require('react-native-square-view');

var SquareViewDemo = React.createClass({

  render: function() {

    return (

      

        Parent w {'>'} h and direction is column:

        

          

            A

          

          

            A

          

        

        Parent w {'>'} h and direction is row:

        

          

            B

          

          

            B

          

          

            B

          

        

        Parent w {'<'} h and direction is column:

        

          

            C

          

          

            C

          

        

        Parent w {'<'} h and direction is row:

        

          

            D

          

          

            D

          

        

      

    );

  }

});

var styles = StyleSheet.create({

  container: {

    flex: 1

  }

});

AppRegistry.registerComponent('SquareViewDemo', () => SquareViewDemo);

```

---

## License

Available under the MIT license. See the LICENSE file for more informatiion.