ConcernItem.js 2.95 KB
import React, {Component} from "react";
import {Image, ImageBackground, StyleSheet, Text, View} from "react-native";
import {width,zoomW,zoomH} from "../../../utils/getSize";
import {scaleHeight, setSpText} from "../../../utils/ScreenUtil";

const defaultIcon = require("../../../img/defaultIcon.png");
const txbg = require("../../../img/txbg.png");
const gzgd = require("../../../img/gzgd.png");
const vIcon = require("../../../img/v.png");

export default class ConcernItem extends Component {
    // constructor(props) {
    //     super(props);
    //     return {
    //
    //     };
    // }

    static defaultProps = {

        concernName: "",
        isVShow: true,
        isMore: false,
        url: ""

    }

    renderVView() {
        if (this.props.isVShow) {
            return <Image source={vIcon} style={styles.headPhotoVStyle} />;
        }
        return null;
    }

    render() {
        if (this.props.isMore) {
            return (
                <View style={[styles.container,{width:width/5}]}>
                    <ImageBackground style={styles.headPhotoViewStyle}>
                        <Image source={gzgd} style={styles.headPhotoStyle} />
                    </ImageBackground>
                    <Text numberOfLines={1} style={[styles.concernNameStyle]}>{this.props.concernName}</Text>
                </View>
            );
        }else{
            return (
                <View style={styles.container}>
                    <ImageBackground style={styles.headPhotoViewStyle} source={txbg}>
                        <Image
                            source={
                                !!!this.props.url || this.props.url == "" || this.props.url.indexOf("http") == -1
                                    ? defaultIcon
                                    : { uri: this.props.url }
                            }
                            style={styles.headPhotoStyle}
                        />
                        {this.renderVView()}
                    </ImageBackground>
                    <Text numberOfLines={1} style={styles.concernNameStyle}>{this.props.concernName}</Text>
                </View>
            );
        }
    }
}

const styles = StyleSheet.create({
    container: {
        width: width/5,
        height: scaleHeight(108),
        backgroundColor:'#fff',
        flexDirection: 'column',
        justifyContent: 'center',
        alignItems:'center',
    },
    headPhotoViewStyle: {
        width: width/5-20,
        height: width/5-20,
        alignItems: 'center',
        justifyContent: 'center'
    },
    headPhotoStyle: {
        width: width/5-26,
        height: width/5-26,
        borderRadius:(width/5-26)/2
    },
    headPhotoVStyle: {
        width: 15,
        height: 15,
        position: 'absolute',
        right: 2,
        bottom: 3,
    },
    concernNameStyle: {
        marginTop: scaleHeight(4),
        color: '#000000',
        fontSize: setSpText(12),
        opacity: 0.65,
        maxWidth: width/5
    }
});