如何在React Native Modal Dropdown的下拉列表中自定义FontSize?

时间:2017-05-29 06:41:57

标签: reactjs react-native dropdown

我想在React Native Modal Dropdown库的下拉列表中更改fontsize。因为这样小。

enter image description here

但是,如果我使用dropdownTextStyle仍然无法正常工作。这是我的代码

<ModalDropdown
                  style={{height: 40}}
                  textStyle={{fontSize: 16, paddingTop: 8, paddingBottom: 8}}
                  dropdownStyle={styles.dropdown}
                  dropdownTextStyle={{fontSize: 30}}
                  options={this.state.status_option}
                  defaultIndex={-1}
                  defaultValue={'Please select'}

                />

请帮助解决这个问题

2 个答案:

答案 0 :(得分:0)

您可以使用如下的renderRow道具

添加renderRow={this.renderRow.bind(this)}

 <ModalDropdown
  ...
  renderRow={this.renderRow={this.renderRow.bind(this)}.bind(this)}
  .../>

然后,定义renderRow

renderRow (rowData, rowID, highlighted) {
    return (
      <TouchableHighlight underlayColor='#36baac'>
        <View >
          <Text style={styles.textDropdown} numberOfLines={1} ellipsizeMode={'tail'}>
            {rowData}
          </Text>
        </View>
      </TouchableHighlight>
    )
  }

因此您可以根据需要修改textDropdown样式。

答案 1 :(得分:-1)

我们可以提供css类名作为属性的一部分来设置下拉列表的css。 请参阅代码示例类名称&#34; form-control&#34;设置为下拉AnswerGroup

@Html.DropDownList("AnswerGroup", (IEnumerable<SelectListItem>)(ViewBag.DropDownAnswerGroup), " ---- Please Select Answer Group ---- ", new { @onchange = "GroupValues(this.value)", id = "dpanswergroup",@class= "form-control" })

请参阅link了解更多信息