/**
 * Created by Sean on 2018/5/9.
 */
import {
	View,
	Text,
	StyleSheet,
    TouchableOpacity,
    TouchableWithoutFeedback,
    ScrollView,
    SectionList,
    Image,
    Animated
} from 'react-native'
import React, {Component} from 'react'
import PropTypes from 'prop-types';
import {NavigationBarHeight, TabBarHeight, ScreenDimensions} from '../../../utils/DimensionsTools'

const Header_Title = [
    {text: '推荐视频', image: require('../../../resources/Play/Video/video.png')},
    {text: '脱口秀', image: require('../../../resources/Play/Video/speak.png')},
    {text: '外教课', image: require('../../../resources/Play/Video/book.png')},
    {text: '音乐', image: require('../../../resources/Play/Video/music.png')},
];


export default class CAVideoListHeaderView extends Component {
    constructor(props) {
        super(props)
    }

    render() {
        return(
            <View style={styles.headerContainer}>
                <Image style={styles.headerImageView} source={this.props.image} />
                <View style={{flex: 3}}>
                    <Text style={styles.title}>
                        {this.props.title}                        
                    </Text>
                </View>
                <View style={styles.moreContainer}>
                    <Text style={styles.moreTitle}>
                        更多 >>
                    </Text>
                </View>
                <View style={{width: ScreenDimensions.width, height:2.0, backgroundColor: '#efeff4', position: 'absolute', left: 0,
					bottom: 0}} />
            </View>
        );
    }
}

const styles = StyleSheet.create({
    view: {
        flex: 1
    },
    headerContainer: {
        flexDirection: 'row',
        width: ScreenDimensions.width,
        alignItems: 'center',
        height: 43,
        backgroundColor: 'white'
    },
    headerImageView: {
        width: 17,
        height: 17,
        marginHorizontal: 9,
    },
    title: {
        width: 100,
        fontSize: 16,
        marginHorizontal: 12,
    },
    moreContainer: {
        flex: 1,
        alignItems: 'flex-end',
        justifyContent: 'center',
    },
    moreTitle: {
        fontSize: 11,
        color: "#aaaaaa",
    }
})