如何设置 React-native 选择器项目的样式以包装冗长的文本? [英] How to style the React-native picker items to wrap the lengthy text?
本文介绍了如何设置 React-native 选择器项目的样式以包装冗长的文本?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我使用 react native 设计了一个选择器,我正在尝试使用 style.XML 对其进行样式设置,但它不起作用.当文本长度超过宽度时,我希望我的下拉项目在第二行换行.
I have designed a picker using react native, and I'm trying to style it using styles.XML BUT its not working. I want my drop down items to wrap in second line when the length of the text exceeds the width.
class PickerExample extends Component {
state = {link: ''}
updateUser = (link) => {
this.setState({ link: link })
}
render() {
return (
<View>
<Picker selectedValue = {this.state.user} onValueChange = {this.updateUser}>
<Picker.Item label = "25 best small-business apps in 2018 - nerdwallet" value = "one" />
<Picker.Item label = "Top business apps, best apps for small business" value = "two" />
<Picker.Item label = "Collaboration & productivity apps for business" value = "three" />
</Picker>
<Text style = {styles.text}>{this.state.link}</Text>
</View>
)
}
}
export default PickerExample
样式.xml
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="android:spinnerItemStyle">@style/SpinnerItem</item>
<item name="android:spinnerDropDownItemStyle">@style/SpinnerDropDownItem</item>
</style>
<style name="SpinnerItem" parent="Theme.AppCompat.Light.NoActionBar">>
<item name="android:fontFamily">segoe-ui</item>
</style>
<style name="SpinnerDropDownItem" parent="Theme.AppCompat.Light.NoActionBar">>
<item name="android:layout_width">fill_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:singleLine">false</item>
</style>
</resources>
推荐答案
将以下行添加到您的自定义样式中
Add below line into your custom style
<item name="android:inputType">textMultiLine</item>
希望这会奏效!
这篇关于如何设置 React-native 选择器项目的样式以包装冗长的文本?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文