项目中常用的组件

 

//进度条

import { Slider } from 'react-native-elements';

                               <Slider

                                    value={0.3}

                                    disabled={true}

                                    maximumTrackTintColor={'#ccc'}

                                    minimumTrackTintColor={'#37a3ff'}

                                    thumbStyle={{ borderWidth: 6, borderColor: '#37a3ff', }}

                                    thumbTintColor={'#fff'}

                                    // style={{backgroundColor:'red'}}

                                />

//table表格

import { Row, Rows, Table } from 'react-native-table-component';

this.state = {

            tableHead: ['日期', '星期', '班次'],

            tableData: [

                ['4-10',

                    '资方姓名',

                    '白班'

                ],

                ['4-20',

                    '企业名称',

                    '夜班'

                ], 

            ]

        }

                       <View style={{ paddingHorizontal: 20 }}>

                            <Table borderStyle={{ borderWidth: 1, borderColor: '#dcdddd' }}>

                                <Row data={tableHead} style={styles.head} textStyle={styles.text} />

                                <Rows data={tableData} style={styles.list} textStyle={styles.textLIst} />

                            </Table>

                        </View>

head: {

        backgroundColor: '#37a3ff',

        height: 50,

    },

    text: {

        textAlign: 'center',

        color: 'white'

    },

    textLIst: {

        textAlign: 'center',

    },

    list: {

        height: 40,

    },

 

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐