MessageDetail.js 2.11 KB
'use strict';

import React from 'react-native';

let {
    Component,
    View,
    Text,
    ListView,
    TouchableHighlight,
    Dimensions,
    StyleSheet,
    Platform,
    TouchableOpacity
} = React;

export default class MessageDetail extends Component {

    static propTypes = {
            title: React.PropTypes.string,
            time: React.PropTypes.string,
            content: React.PropTypes.string,
    };

    constructor(props) {
        super(props);

    }

	render() {
        return (
             <View style={styles.container}>
                    <View style={styles.row_top}>
                        <Text style={styles.title}>{this.props.title}</Text>
                    </View>
                    <View style={styles.line}/>
                    <Text style={styles.subtitle}>{this.props.content}</Text>
                    <Text style={styles.text_detail}>Yoho!buy有货</Text>
                     <Text style={styles.text_detail}>{this.props.time}</Text>
                </View>
        );
    }

}

let {height, width} = Dimensions.get('window');
const styles = StyleSheet.create({
    container:{
        flex: 1,
        width: width,
        height: height,
        paddingLeft:8,
        top:(Platform.OS === 'android') ? 50 : 64,
        backgroundColor: '#F5FCFF',
    },
    title: {
        flex: 1,
        color: '#444444',
        fontSize: 20,
        marginLeft: 10,
        marginRight: 18,
    },
    row_top: {
        flexDirection: 'row',
        height: 50,
        width: width,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#F5FCFF',
    },
    subtitle: {
        fontSize: 14,
        marginLeft:8, 
        color: '#444444',
        marginRight: 18,
    },
    column: {
        flexDirection: 'column',
        height: 100,
        width: width,

        backgroundColor: '#F5FCFF',
    },
    line: {
        height: 1,
        backgroundColor: '#B0B0B0',
        marginLeft:8,
        marginBottom:8,
     },
     text_detail: {
        fontSize: 12,
        alignSelf: 'flex-end',
        marginRight:10, 
        color: '#B0B0B0', 
       
    },
});