ExampleScreen.ios.js

// notes:
// notice how this file is not related at all to react-native-controllers, this is how you would define a regular
// React component that's connected to a redux store
// we don't want to add react-native-controllers modifications in every one of your screens, see app.ios.js + index.ios.js 
// to see how we concentrate all necessary modifications in one place

import React, {
  Component,
  Text,
  View,
  TouchableOpacity
} from 'react-native';
import { connect } from 'react-redux';

import * as counterActions from '../reducers/counter/actions';

class ExampleScreen extends Component {
  constructor(props) {
    super(props);
  }
  render() {
    return (
      <View style={{paddingTop:20}}>
        <Text style={{fontSize: 16}}>Example Screen</Text>
        <Text style={{marginTop: 20}}>Counter: {this.props.counter.count}</Text>
        <TouchableOpacity onPress={this.onIncrementPress.bind(this)}>
          <Text style={{color: 'blue'}}>Increment</Text>
        </TouchableOpacity>
      </View>
    );
  }
  onIncrementPress() {
    this.props.dispatch(counterActions.increment());
  }
}

// which props do we want to inject, given the global state?
function mapStateToProps(state) {
  return {
    counter: state.counter
  };
}

export default connect(mapStateToProps)(ExampleScreen);