ScrollView not Scrolling - ReactNative

I have the following ScrollView, but my attempt just won't scroll. I am not sure what am going about it wrong in my implementation. Hope you can help.

Thank you all in advance.

class RecentMediaUploadsWidget extends Component {
  renderImage = (imgURI) => {
    return (
      <TouchableOpacity>
        <View>
          <Image
            style={styles.imageStyle}
            source={{ uri: ("file:///" + imgURI) }}
          />
        </View>
      </TouchableOpacity>
    )
  }
  render() {
    return (
      <View style={styles.containerWrapper}>
        <ScrollView>
          <View style={styles.mainContainerStyle}>{this.props.itemsPaths.map(this.renderImage)}</View>
        </ScrollView>
      </View>
    );
  }
}

export default RecentMediaUploadsWidget;

And the styles is showing below

var styles = StyleSheet.create({
  containerWrapper: {
    flexDirection: 'column',
    alignSelf: 'flex-start',
  },
  mainContainerStyle: {
    flexDirection: 'row',
    flex: 1,
  },
  imageStyle: {
    width: imgWidth, height: imgWidth,
    overflow: "hidden",
    alignSelf: 'stretch',
  },
})