index.ios.js

'use strict';

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

var {
  AppRegistry,
  StyleSheet,
  Text,
  requireNativeComponent,
  PropTypes,
  View
} = React;

var styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  customView: {
    width: 10,
    height: 10
  }
});

var _MyCustomView = React.createClass({
  propTypes: {
    isRed: PropTypes.bool
  },

  render: function () {
    return <CustomView {...this.props}/>;
  }
});

var CustomView = requireNativeComponent('MyCustomView', _MyCustomView);

var MyCustomView = React.createClass({
  render: function() {
    return (
      <View style={styles.container}>
        <Text>Red one</Text>
        <_MyCustomView style={styles.customView} isRed={true}/>
        <Text>Not red one</Text>
        <_MyCustomView style={styles.customView} isRed={false}/>
      </View>
    );
  }
});

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