Connecting the final pieces
Now that we have
CameraScreen and ImageScreen, we need to be able to navigate to them via the NoteScreen. We are going to add a button that will change the state based on the imagePath of the note. If it does not exist, then we want the user to transition to the CameraScreen and the ImageScreen when it does. Visually we are going to place the button in-line with the title input:
import SimpleButton = from './SimpleButton';
export default class NoteScreen extends React.Component {
...
blurInputs () {
this.refs.body.blur();
this.refs.title.blur();
}
render () {
var pictureButton = null;
if (this.props.showCameraButton) {
pictureButton = (this.state.note.imagePath) ? (
<SimpleButton
onPress={() => {
this.blurInputs();
this.props.navigator.push({
name: 'noteImage',
note: this.state.note
});
}}
customText="View Picture"
...