React原生选择器看起来很好并且在ios中很糟糕

时间:2017-12-04 12:04:53

标签: android ios react-native picker

我使用一个反应本机选择器来处理用户必须填写的三个不同的东西,以便向公司报告他/她的时间。在Android上看起来一切都很好,你点击一个小字段然后弹出选项,但在ios中它变成了这个巨大的领域,你可以通过选项循环。我认为这是一个常见的问题,似乎无法找到人们如何让它看起来类似于android方式。

谁有任何想法或者或许以前做过这个?

1 个答案:

答案 0 :(得分:-1)

也许,您可以根据平台(Android - IOS)指定不同的样式:

    import { Platform, Text, TouchableOpacity } from 'react-native';

    function SubmitBtn ({ onPress }) {
        return (
          <TouchableOpacity style={Platform.OS === 'ios' ? styles.iosSubmitBtn : styles.androidSubmitBtn} onPress={onPress}>
              <Text style={styles.submitBtnText}>Submit</Text>
          </TouchableOpacity>
        )
    }

const styles = StyleSheet.create({
    iosSubmitBtn: {
        backgroundColor: lightPurp,
        marginTop: 50,
        padding: 10,
        borderRadius: 7,
        height: 45,
        marginLeft: 20,
        marginRight: 20,
    },

    androidSubmitBtn: {
        backgroundColor: lightPurp,
        marginTop: 50,
        padding: 10,
        paddingLeft: 30,
        paddingRight: 30,
        height: 45,
        borderRadius: 2,
        marginLeft: 20,
        marginRight: 20,
        justifyContent: 'center',
        alignItems: 'center',
    },

    submitBtnText: {
        color: white,
        fontSize: 22,
        textAlign: 'center',
    },
});