ImageGrid
A simple scroll view and a list of images. This component is as simple as that, but it's configured in a way that allows the images to flow like a grid in an easy way:
/*** src/components/ImageGrid ***/
import React from 'react';
import {
Image,
TouchableOpacity,
ScrollView,
Dimensions,
View,
StyleSheet
} from 'react-native';
var {height, width} = Dimensions.get('window');
export default class ImagesGrid extends React.Component {
render() {
return (
<ScrollView>
<View style={styles.imageContainer}>
{
this.props.images &&
this.props.images.map(img => {
return (<Image style={styles.image}
key={img.id} source={{uri: img.src}}/>);
})
}
</View>
</ScrollView>
);
}
}
const styles = StyleSheet.create({
imageContainer: {
flexDirection: 'row',
alignItems: 'flex-start',
flexWrap: 'wrap'
},...