How to implement selected checkbox onto photo in react native?

I am working on a react native app that will have a ListView consisting of images displayed in rows.

There is a select button that once pressed a checkbox should appear on top of the images, allowing the user to select any picture they want. If the select button is pressed again, it should make the checkboxes disappear.

It should look something like this when the select button is pressed:

Then is should look like this, when the select button is not pressed:

Here is the code I have so far:

var select; 

class ImageList extends Component {
constructor(props){
super(props);
this.state = {
  show: false,
};
}

componentWillMount(){
const ds = new ListView.DataSource({
  rowHasChanged: (r1, r2) => r1 !== r2
});
this.dataSource = ds.cloneWithRows(this.props.images);
}

onClick(){
this.setState({
  show: !this.state.show
})
}

renderRow(rowData){
 const {uri} = rowData;

 select = this.state.show ?
   ( <CheckBox
     onClick={()=>this.onClick()}/> ) : ( <View /> );

 return(
  <View style=>
   <TouchableHighlight
     onPress={this.onClick.bind(this)}
   >
     <Image style={styles.imageSize} source=>

       <View style=>
         {select}
       </View>

     </Image>
   </TouchableHighlight>

 </View>
  <Image style={styles.imageSize} source= />
 )
}

  render() {
    return (
      <View>
        <ListView
          contentContainerStyle={styles.list}
          dataSource={this.dataSource}
          renderRow={this.renderRow.bind(this)}
        />

        <TouchableHighlight onPress={this.onClick.bind(this)}>
            <Text>Select</Text>
        </TouchableHighlight>
      </View>
    );
  }
}

If show is set to false then once the Select button is pressed it changes it to true and the checkboxes should appear. But nothing happens although the state of show is changed.

If show is set to true then the checkboxes do appear but the Select does not make them disappear.

How can I get this to work?