/**
 * Created by jone on 2017/4/10.
 */
import React, {Component} from 'react';

import {
    View,
    Text,
    TouchableWithoutFeedback,
    StyleSheet,
    TouchableOpacity,
    Image,
    Dimensions,
} from 'react-native';
import  {getIcon} from '../../util/iconParse';
export default class MoreAppCell extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        let {data} = this.props;
        let params =  data.toJSON();
        let image  = getIcon(params.id);
        let id = params.id;
        return (
            <TouchableOpacity
                activeOpacity={0.5}
                onPress={() => {this.props.onPressIcon && this.props.onPressIcon(id)}}
            >
                <View style={styles.container}>
                 {/*   <Image source={require(this.props.data.image_url)} style={styles.topImgStyle}/>*/}
                    <Image source={image} style={styles.topImgStyle}/>
                    <Text >{params.recommondName}</Text>
                </View>
            </TouchableOpacity>

        )
    }

};

let {width, height} = Dimensions.get('window');
let cols = 4;
let cellW = 60;
let vMargin = (width - cellW * cols) / (cols + 1);

let cellWidth = width / 4;
let styles = StyleSheet.create({
    container: {
        backgroundColor:'white',
        justifyContent:'center',
        alignItems:'center',
        width:cellWidth,
        marginTop:20,
        // marginLeft:vMargin
    },
    topImgStyle: {
        width:60,
        height:60,
        marginBottom:8
    },

});