item.js 1.52 KB
Newer Older
Giang Tran committed
1 2 3 4 5 6 7
import React, {Component} from 'react';

import {View, Text, StyleSheet, Image, TouchableOpacity} from 'react-native';
import Block from '../../../components/Block';
import Icon from 'react-native-vector-icons/AntDesign';
import {getFontXD} from '../../../Config/Functions';
import R from '../../../assets/R';
Giang Tran committed
8 9
import {useNavigation} from '@react-navigation/native';
import {DETAILNEW} from '../../../routers/ScreenNames';
Giang Tran committed
10 11

const Item = (props) => {
Giang Tran committed
12 13
  const navigate = useNavigation();
  const {title, image, published_at, id} = props.item;
Giang Tran committed
14 15
  return (
    <TouchableOpacity
Giang Tran committed
16
      onPress={() => navigate.navigate(DETAILNEW, {id})}
Giang Tran committed
17
      style={styles.container}>
Giang Tran committed
18 19 20
      <Text numberOfLines={2} style={styles.txtTitle}>
        {title}
      </Text>
Giang Tran committed
21 22 23 24 25
      <View style={styles.row}>
        <Icon name={'calendar'} style={{marginRight: 10}} size={15} />
        <Text style={styles.txtDate}>{published_at}</Text>
      </View>

Giang Tran committed
26
      <Image source={{uri: image}} resizeMode={'cover'} style={styles.img} />
Giang Tran committed
27 28 29 30 31 32
    </TouchableOpacity>
  );
};

const styles = StyleSheet.create({
  container: {
Giang Tran committed
33
    marginTop: 15,
Giang Tran committed
34 35 36 37 38 39 40
  },
  row: {
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between',
    marginVertical: 10,
  },
Giang Tran committed
41

Giang Tran committed
42
  txtTitle: {
Giang Tran committed
43
    fontSize: getFontXD(42),
Giang Tran committed
44 45 46
    color: 'black',
    fontWeight: 'bold',
  },
Giang Tran committed
47
  txtDate: {
Giang Tran committed
48
    fontSize: getFontXD(36),
Giang Tran committed
49 50
    color: '#A2A2A2',
  },
Giang Tran committed
51
  img: {
Giang Tran committed
52 53
    height: 180,
    borderRadius: 10,
Giang Tran committed
54
    marginTop: 5,
Giang Tran committed
55
  },
Giang Tran committed
56 57 58 59
  row: {
    flexDirection: 'row',
    alignItems: 'center',
  },
Giang Tran committed
60 61 62
});

export default Item;