Skip to content

Instantly share code, notes, and snippets.

@furkancelik
Created Sep 21, 2017
Embed
What would you like to do?
/* @flow */
import React, { PureComponent } from 'react';
import { TouchableHighlight, Image, Dimensions } from 'react-native';
const { width }: { width: number } = Dimensions.get('window');
type node = { node: { image: { uri: string } } };
type State = {};
type Props = {
item: node,
selectImageItem: Object | node,
selectImage(item: Object): void,
};
export default class ProfilePictureItem extends PureComponent<void, Props, State> {
props: Props;
state: State;
selectImage(item: Object) {
this.props.selectImage(item);
}
render() {
const { item } = this.props;
return (
<TouchableHighlight onPress={() => this.selectImage(item)}>
<Image
source={{ uri: item.node.image.uri }}
style={{
width: width / 4 - 5,
height: width / 4 - 5,
margin: 2,
borderWidth:
this.props.selectImageItem.node.image.uri === item.node.image.uri
? (width / 4 - 5) / 2
: 0,
borderColor:
this.props.selectImageItem.node.image.uri === item.node.image.uri
? 'rgba(255,255,255,0.4)'
: 'transparent',
}}
/>
</TouchableHighlight>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment