/**
 * Created by jone on 2017/4/10.
 */
import React,
{
    Component
} from "react";
import {
    View,
    Text,
    TouchableWithoutFeedback,
    StyleSheet,
    TouchableOpacity,
    ScrollView,
    Image,
    Dimensions,
    ListView,
} from "react-native";

import RecommondAppCell from '../components/common/RecommondAppCell'

export default class Recommond extends Component {
    constructor(props) {
        super(props);
        this.dataSource = new ListView.DataSource({rowHasChanged: (r1, r2) => !immutable.is(r1, r2)});
        this.renderRow = this.renderRow.bind(this);
    }

    render() {
        return (
            <View style={styles.container}>
                {/* <View
                 style={styles.topContainerStyle}
                 >

                 </View>*/}
                {this.renderListView()}
                <View style={styles.middleContainerStyle}>
                    <View style={styles.middleLineStyle}/>
                    <Text >或</Text>
                    <View style={styles.middleLineStyle}/>
                </View>
                <View
                    style={styles.bottomContainerStyle}
                >
                    <Image
                        style={styles.logoViewStyle}
                        source={require("../images/mine_about_yoho.png")}
                    />
                    <Text>扫描上方二维码安装有货</Text>
                </View>
            </View>
        );
    }

    renderListView(){
        return (
            <ListView
                contentContainerStyle={styles.contentContainer}
                renderRow={this.renderRow}
                dataSource={this.dataSource.cloneWithRows(this.props.dataSource.toArray())}
            />
        );
    }

    renderRow(rowData, sectionID, rowID){
        return (
            <RecommondAppCell
                onPressIcon ={this.props.onPressIcon}
                data={rowData}
            />
        );
    }

};
let {width, height} = Dimensions.get('window');
let cellWidth = width / 4;
let styles = StyleSheet.create({
    container: {
        backgroundColor: '#ffffffff',
        alignItems:'center',
        flex:1
    },
    listContainer: {
        flexWrap: 'wrap',
    },

    contentContainer: {
        flexDirection:'row',
        flexWrap:'wrap',
        // width: width,
        backgroundColor: 'white',
        alignItems: 'flex-start',
        marginTop:10,
        flex:1
    },

    topContainerStyle: {
    },
    bottomContainerStyle: {
        width: width,
        flex: 1,
        alignItems:'center'
    },
    middleContainerStyle: {
        width: width,
        margin: 20,
        flexDirection: 'row',
        justifyContent:'center',
        alignItems:'center'
    },
    middleLineStyle:{
        flex:1,
        height:1,
        backgroundColor:'#c9c9c9',
        margin:20

    },
    logoViewStyle: {
        width: 120,
        height: 120,
        marginTop: 10,
        marginBottom:10
    }


});