-
Notifications
You must be signed in to change notification settings - Fork 0
/
flatlistitem1.js
103 lines (85 loc) · 3.3 KB
/
flatlistitem1.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
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
import React, { Component ,useState} from 'react'
import {
StyleSheet,
TouchableOpacity,
Text,
View,
TextInput, Button, Image,
Alert, FlatList, SafeAreaView
} from 'react-native'
import Icon from 'react-native-vector-icons/AntDesign';
FlatListItem=(props)=>{
return(
<View style={styles.body}>
<View style={styles.innnerbody}>
<View style={styles.aboutuser}>
<View style={styles.name}>
<Text style={{flex:0.4 ,numberOfLines:1}} ></Text>
<Text style={{flex:1,fontWeight:'bold',fontSize:14}}></Text>
</View>
<View style={styles.name}>
<Text style={{flex:0.4 ,numberOfLines:1}} ></Text>
<View style={{flex:1,height:50}}>
<View style={{flexDirection:'row',marginTop:'2%'}}>
<View style={{height:20,width:20,backgroundColor:'#e7f6f6',justifyContent:'center',alignItems:'center',borderRadius:10}}>
<Icon name="user" size={15} style={{color:'#01a9a4',marginRight:1}} />
</View>
<Text style={{marginLeft:'3%',fontSize:12}}>Music Art</Text>
</View>
<View style={{flexDirection:'row',justifyContent:'space-between'}}>
<Text style={{marginTop:'1%',fontSize:12}}>12 jan 2019</Text>
<TouchableOpacity style={{height:25,width:90,borderColor:'blue',borderWidth:1,borderRadius:4,justifyContent:'center',alignItems:'center',borderColor:'#01a9a4'}}>
<Text style={{color:'#01a9a4',fontSize:10,fontWeight:'bold'}}>
Read
</Text>
</TouchableOpacity>
</View>
</View>
</View>
<View style={styles.name}>
{/* <Text style={{flex:0.4,fontWeight:'bold'}} ></Text>
{
showMore===-1?<Text style={{flex:1,color:'red',height:30}}>{props.description}</Text> :<Text style={{flex:1}}>{props.description}</Text>
} */}
{/* <Text style={{flex:1}}>{props.description}</Text> */}
</View>
<View style={styles.name}>
<Text style={{flex:0.4 ,numberOfLines:1,}} ></Text>
<Text style={{flex:1,fontWeight:'bold',fontSize:14}}></Text>
</View>
</View>
</View>
<View style={styles.circleImage}>
{/* {
props.image ?<Image source={{uri:props.image}} style= {{ height:120, width: 90,resizeMode:'stretch' ,borderRadius:10}}/>: null
} */}
<Image style= {{ height:120, width: 90,resizeMode:'stretch' ,borderRadius:10}}/>
</View>
<View style={{height:20,width:'100%',position:'absolute',bottom:0,justifyContent:'center',alignItems:'flex-end',marginRight:'30%',marginBottom:'3%'}}>
{/* <TouchableOpacity style={styles.circleImage1} onPress={handleShowMore}>
</TouchableOpacity> */}
</View>
</View>
)
}
const styles = StyleSheet.create({
body:{
width:'90%',height:'auto',marginTop:'2%',backgroundColor:'#eeeeee',borderRadius:10,marginLeft:'3%',marginRight:'3%'
},
innnerbody:{
height:'auto',backgroundColor:'white',padding:5,
width:'100%',marginVertical:20,borderRadius:10
},circleImage:{
height:100,width:80,position:'absolute',top:0,marginTop:'1%',marginLeft:'3%',borderRadius:10,resizeMode:'stretch'
},
aboutuser:{
width:'100%',
height:'auto',
},name:{
flexDirection:'row',padding:3
},circleImage1:{
height:40,width:20,position:'absolute',backgroundColor:'red',
marginLeft:'6%',borderRadius:30,borderWidth:1,borderColor:'red'
},
});
export default FlatListItem