Question

我想为android和ios创建选择器组件，但是在样式方面遇到问题。

我要完成的工作是设置默认显示的样式选择器文本（可以是占位符，也可以是从选择器列表中选择的项）。

我尝试了下面的代码，但是没有用。

<View style={{ backgroundColor: "#FFFFFF", borderRadius: 3, height: 39, marginTop:5, }}>
  <Picker style={{ width: screenWidth, opacity:0.4, }}

    textStyle={{ color: "blue" }}
    itemStyle={{
    backgroundColor: "green",
    marginLeft: 0,
    paddingLeft: 10
    }}
    itemTextStyle={{ color: '#788ad2' }}
  >
  
    <Picker.Item label="Java" value="java" />
    <Picker.Item label="JavaScript" value="js" />
  </Picker>
</View>

任何帮助将是一大好处。

Answer 1

尝试用下面的代码段替换itemStyle代码。

itemStyle={{
          color: "red",
          fontFamily: "Georgia",
          fontSize: 50,
          backgroundColor: "green",
          textAlign: 'left',
        }}

您显然可以使用Text Style Props在Picker中的PickerIOS，React Native的文本中添加样式。

Answer 2

要设置所选项目的样式，只需将您的首选项样式放入itemStyle。 'textStyle'和'itemTextStyle'是非法道具，您可以在此docs

上检查提供的道具

此外，您可以按照this text styles

中的说明，将this section中的任何一个用于itemStyle

修改：您可以从react-native包中导入Dimension

从'react-native'导入{尺寸};

    <View style={styles.container}>
    <Picker style={{ width: Dimensions.get('window').width, opacity:0.4}}
      itemStyle={{
        color: "blue",
        backgroundColor: "green",
        marginLeft: 0,
        paddingLeft: 10
      }}
    >

      <Picker.Item label="Java" value="java" />
      <Picker.Item label="JavaScript" value="js" />
    </Picker>
  </View>

反应本地和本地基本选择器组件

2 个答案: