-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathCardComponent.js
76 lines (66 loc) · 2.59 KB
/
CardComponent.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
import React, { Component } from "react";
import {
View,
Text,
StyleSheet,
Image
} from "react-native";
import { Card, CardItem, Thumbnail, Body, Left, Right, Button, Icon } from 'native-base'
class CardComponent extends Component {
render() {
const images = {
"1": require('../assets/feed_images/1.jpg'),
"2": require('../assets/feed_images/2.jpg'),
"3": require('../assets/feed_images/3.png')
}
return (
<Card>
<CardItem>
<Left>
<Thumbnail source={require('../assets/me.png')} />
<Body>
<Text>Varun </Text>
<Text note>Jan 15, 2018</Text>
</Body>
</Left>
</CardItem>
<CardItem cardBody>
<Image source={images[this.props.imageSource]} style={{ height: 200, width: null, flex: 1 }} />
</CardItem>
<CardItem style={{ height: 45 }}>
<Left>
<Button transparent>
<Icon name="ios-heart-outline" style={{ color: 'black' }} />
</Button>
<Button transparent>
<Icon name="ios-chatbubbles-outline" style={{ color: 'black' }} />
</Button>
<Button transparent>
<Icon name="ios-send-outline" style={{ color: 'black' }} />
</Button>
</Left>
</CardItem>
<CardItem style={{ height: 20 }}>
<Text>{this.props.likes} </Text>
</CardItem>
<CardItem>
<Body>
<Text>
<Text style={{ fontWeight: "900" }}>varun
</Text>
Ea do Lorem occaecat laborum do. Minim ullamco ipsum minim eiusmod dolore cupidatat magna exercitation amet proident qui. Est do irure magna dolor adipisicing do quis labore excepteur. Commodo veniam dolore cupidatat nulla consectetur do nostrud ea cupidatat ullamco labore. Consequat ullamco nulla ullamco minim.
</Text>
</Body>
</CardItem>
</Card>
);
}
}
export default CardComponent;
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center'
}
});