使用 React Native 0.26,
我的组件是这样的
const Search = () => {
return (
<View style={styles.backgroundImage}>
<TextInput style={styles.textInput} onChangeText={(text) => console.log(text)} placeholder={"Enter Search Term"}/>
</View>
)
}
还有我的风格:
const styles = StyleSheet.create({
backgroundImage: {
flex : 1,
flexDirection: "column",
justifyContent: 'center',
alignItems: 'center'
},
textInput: {
justifyContent: "center",
alignItems: "stretch",
borderRightWidth: 30,
borderLeftWidth: 30,
height: 50,
borderColor: "#FFFFFF",
}
})
我面临的问题是
- 边框右宽度和左宽度似乎没有任何效果,占位符文本只是从左边缘开始。
- TextInput 的背景是“灰色”,与视图的背景相同。我原以为它默认是白色的(感觉透明)。
- 使用iOS模拟器如何调出键盘,我想设置
returnKeyType
看看键盘的样子(并有一些代码onSubmitEditing
和测试)。
Screenshot below :
1 除非启用多行,否则不能直接在 TextInput 上声明特定边框(例如borderLeftWidth
不会起作用,除非multiline={true}
已启用但是borderWidth
会起作用),但您可以将 TextInput 包装在 View 中并给它一个边框。
inputContainer: {
borderLeftWidth: 4,
borderRightWidth: 4,
height: 70
},
input: {
height: 70,
backgroundColor: '#ffffff',
paddingLeft: 15,
paddingRight: 15
}
2 您需要声明backgroundColor
对于文本输入。
3 要显示本机键盘,您需要转到模拟器菜单并断开硬件连接。转到硬件 -> 键盘 -> 连接硬件键盘,将其关闭。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)