dohooo / react-native-table-component

🌱Build table for react native
MIT License
730 stars 188 forks source link

widthArr property is not working #109

Closed ayushishah-easternts closed 4 years ago

ayushishah-easternts commented 4 years ago

Version used:

"react-native": "0.61.5",
"react-native-table-component": "^1.2.1",

I am trying to use this component but the header and rows width are not working as per widthArr variable. Can someone please help me with this?

render() {
        var datePicker = <DatePicker
            locale={"en"}
            modalTransparent={false}
            animationType={"fade"}
            androidMode={"default"}
            maximumDate={this.state.maxDate}
            minimumDate={new Date().setDate(this.state.maxDate.getDate() - 30)}
            placeHolderText="Select date"
            textStyle={{color: "green"}}
            placeHolderTextStyle={{color: "#d3d3d3"}}
            onDateChange={this.setDate}
        />;
        if (this.props.unitRawData && !this.props.unitRawData.isFetching) {
            var tableComp = <ScrollView horizontal={true}>
                <View>
                    <Table borderStyle={{borderWidth: 2, borderColor: '#c8e1ff'}}>
                        <Row data={this.props.unitRawData.unitRawData.tableHead}
                             widthArr={this.props.unitRawData.unitRawData.widthArr}
                             flexArr={this.props.unitRawData.unitRawData.flexArr}
                             style={styles.head}
                             textStyle={styles.text}/>
                    </Table>
                    <ScrollView style={{marginTop: -1}}>
                        <Table borderStyle={{borderWidth: 1, borderColor: '#C1C0B9'}}>
                            <Rows data={this.props.unitRawData.unitRawData.tableData}
                                  widthArr={this.props.unitRawData.unitRawData.widthArr}
                                  flexArr={this.props.unitRawData.unitRawData.flexArr}
                                  textStyle={styles.text}/>
                        </Table>
                    </ScrollView>
                </View>
            </ScrollView>;
        }
        return (
            <Layout title={this.props.unit.name}>
                <Content padder>
                    {datePicker}
                    <View style={{flex: 1, padding: 16, paddingTop: 30}}>
                        {tableComp}
                    </View>
                </Content>
            </Layout>
        )
    }

Screenshot_1576408664

ayushishah-easternts commented 4 years ago

I was making issue with the variable passed against widthArr prop