Question

我是反应原生的新手。我需要一个从file.js读取的下拉列表。我使用了如下选择器：

<Picker
style={Commonstyles.dropdownStyle}
mode="dropdown"
selectedValue={this.state.PickerValueHolderCity}
onValueChange={(itemValue, itemIndex) => this.setState({PickerValueHolderCity: itemValue})}>
{ console.log("mydataxxx", mydata) && this.renderPickerItemsCity(mydata)}

</Picker>

一切都适合我。我的问题是我需要应用具有灰色背景和曲线年龄的样式。但是，它只显示没有曲线边框的灰色背景。

我使用了以下风格：

  dropdownStyle: {
    //flex: 1,
    backgroundColor: '#ecf0f1',
    marginBottom: 7,
    padding: 7,
    alignSelf: "stretch",
    // Set border width.
    borderWidth: 1,
    // Set border Hex Color Code Here.
    borderColor: '#bdc3c7',
    // Set border Radius.
    borderRadius: 10 ,
    //  marginBottom: 10,
  },

您能帮我在拣货员上应用以下风格吗？我应该提一下，我的风格在我的文本框上运行良好。

Answer 1

将您的选择器放在视图中

UNION ALL

并将Picker的宽度设置为View的宽度。

Answer 2

来自https://www.npmjs.com/package/react-native-dropdown-picker的

解决方案。您唯一需要避免的是borderRadius。所有角必须单独设置。

style={{
    borderTopLeftRadius: 10, borderTopRightRadius: 10,
    borderBottomLeftRadius: 10, borderBottomRightRadius: 10
}}

Answer 3

使用此代码。这对我有用。

<View
    style={{
    paddingVertical: 8,
    backgroundColor: '#fff',
    borderWidth: 1,
    borderRadius: 20,
}}>
    <Picker style={{height: 24}}>
        <Picker.Item label="Java" value="java" />
        <Picker.Item label="JavaScript" value="js" />
    </Picker>
</View>

Picker无法接受borderRadius表单样式

3 个答案: