123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167 |
- import {
- View,
- Text,
- StyleSheet,
- Image,
- ImageBackground,
- TouchableOpacity,
- FlatList
- } from 'react-native'
- import React, {Component} from 'react'
- import {NavigationBarHeight, TabBarHeight, ScreenDimensions} from '../../../../utils/DimensionsTools'
-
- export default class AnswerQuestionCommentItem extends Component {
- constructor(props) {
- super(props)
- this.state = {
- headerImageUrl: props.headerImageUrl,
- likes: props.likes,
- shares: props.shares,
- commentCount: props.commentCount,
- userName: props.userName,
- commentContent: props.commentContent,
- read: props.read
- }
- }
-
- componentWillReceiveProps(props) {
- this.setState({
- headerImageUrl: props.headerImageUrl,
- likes: props.likes,
- shares: props.shares,
- commentCount: props.commentCount,
- userName: props.userName,
- commentContent: props.commentContent,
- read: props.read
- })
- }
-
- shouldComponentUpdate(nextProps) {
- if (nextProps.headerImageUrl !== this.state.headerImageUrl ||
- nextProps.likes !== this.state.likes ||
- nextProps.shares !== this.state.shares ||
- nextProps.commentCount !== this.state.commentCount ||
- nextProps.userName !== this.state.userName ||
- nextProps.commentContent !== this.state.commentContent ||
- nextProps.read !== this.state.read
- ) {
- return true
- }
-
- return false
- }
-
- render() {
- return(
- <View style={styles.View}>
- <View style={styles.UserInfoBgView}>
- <ImageBackground source={require('../../../../resources/images/TabBar/Community/Answer/user.png')} style={styles.UserHeaderImageView}>
- {/*<Image style={styles.UserHeaderTagImageView}/>*/}
- </ImageBackground>
- <Text style={styles.UserName}>{this.state.userName}</Text>
- </View>
-
- <Text style={styles.TitleText}>{this.state.commentContent}</Text>
-
- <Text style={styles.ReadNumberText}>{this.state.read + '阅读'}</Text>
-
- <View style = {styles.BottomTagBgView}>
- <View style={styles.BottomLineView} />
-
- <TouchableOpacity onPress={() => {
- this.props.clickItemBottomButton(0)
- }} style={styles.BottomButtonView}>
- <Image source={require('../../../../resources/images/TabBar/Community/Answer/like.png')} style={[styles.BottomButtonImageView, {marginLeft: 48}]}/>
- <Text style={styles.BottomButtonText}>{this.state.likes}</Text>
- </TouchableOpacity>
-
- <TouchableOpacity style={styles.BottomButtonView}>
- <Image source={require('../../../../resources/images/TabBar/Community/Answer/mess.png')} style={styles.BottomButtonImageView}/>
- <Text style={styles.BottomButtonText}>{this.state.commentCount}</Text>
- </TouchableOpacity>
-
- <TouchableOpacity style={styles.BottomButtonView}>
- <Image source={require('../../../../resources/images/TabBar/Community/Answer/Forward.png')} style={[styles.BottomButtonImageView]}/>
- <Text style={[styles.BottomButtonText, {marginRight: 48}]}>{this.state.shares}</Text>
- </TouchableOpacity>
- </View>
-
- </View>
- )
- }
- }
-
- const styles = StyleSheet.create({
- View: {
- width: ScreenDimensions.width,
- backgroundColor: 'white',
- },
- UserInfoBgView: {
- marginTop: 13,
- width: ScreenDimensions.width,
- flexDirection: 'row',
- alignItems: 'center',
- },
- UserHeaderImageView: {
- width: 48,
- height: 48,
- borderRadius: 24,
- backgroundColor: 'red',
- marginLeft: 24,
- },
- UserHeaderTagImageView: {
- height: 9,
- width: 9,
- backgroundColor: 'blue',
- position: 'absolute',
- bottom: 0,
- right: 0,
- },
- UserName: {
- fontSize: 15,
- color: '#505050',
- marginLeft: 27
- },
- TitleText: {
- fontSize: 15,
- color: '#000000',
- marginLeft: 24,
- marginTop: 14,
- },
- ReadNumberText: {
- fontSize: 15,
- color: '#9c9c9c',
- marginLeft: 24,
- marginTop: 20,
- },
- BottomTagBgView: {
- marginTop: 24,
- width: ScreenDimensions.width,
- height: 56,
- backgroundColor: '#eef0ef',
- flexDirection: 'row',
- },
- BottomButtonView: {
- width: ScreenDimensions.width/3.0,
- height: 48,
- flexDirection: 'row',
- justifyContent: 'center',
- alignItems: 'center',
- backgroundColor: 'white'
- },
- BottomButtonImageView: {
- marginRight: 13,
- },
- BottomButtonText: {
- fontSize: 13,
- color: '#9c9c9c'
- },
- BottomLineView: {
- position: 'absolute',
- width: ScreenDimensions.width,
- height: 0.5,
- backgroundColor: '#d7d7d7',
- left: 0,
- top: 0,
- },
- })
|