文本输入占位符在本机反应中下降
Text input placeholder going down in react native
在我的 React 本机应用程序中,当我按下文本输入时,占位符会下降一点,如下图所示。我们该如何解决这个问题?只需触摸并在屏幕上滚动即可进行此更改。有或没有滚动视图都不起作用
> below is my code
<ScrollView>
<View style={styles.Seventh}>
<View style={styles.Eighth}>
<Image style={styles.Imagethird} source={require('../src/Assets/Profile-xhdpi.png')} />
</View>
<View style={styles.ninth}>
<Text style={styles.Textthird}>USER'S NAME</Text>
<TextInput placeholder="user's name " style={styles.one} underlineColorAndroid='transparent'
//--------------value Handler----------------//
onChangeText={(firstName) => this.setState({firstName})}
//---------------------------------//
/>
</View>
</View>
</ScrollView>
Seventh: {
height: 60,
width: '100%',
borderRadius: 70,
flexDirection: 'row',
elevation: 3,
backgroundColor: 'white',
marginTop:10
},
Eighth: {
height: 60,
width: '20%',
justifyContent: 'center',
alignItems: 'center'
},
Imagethird: {
height: 20,
width: 20,
resizeMode: 'contain',
},
ninth: {
height: 60,
width: '80%',
},
Textthird: {
marginRight:29,
marginTop: 10,
fontSize: 12,
color: '#C7C7CD'
},one:{
marginBottom:25,
fontWeight:'bold',
}
[1]: https://i.stack.imgur.com/Cq2wx.png
我认为问题出在边距上。我也有这个问题,发现文本输入有默认边距值,尝试将边距设置为 0,
<TextInput style={{margin:0,padding:0}} placeholder="place holder"/>
在我的 React 本机应用程序中,当我按下文本输入时,占位符会下降一点,如下图所示。我们该如何解决这个问题?只需触摸并在屏幕上滚动即可进行此更改。有或没有滚动视图都不起作用
> below is my code
<ScrollView>
<View style={styles.Seventh}>
<View style={styles.Eighth}>
<Image style={styles.Imagethird} source={require('../src/Assets/Profile-xhdpi.png')} />
</View>
<View style={styles.ninth}>
<Text style={styles.Textthird}>USER'S NAME</Text>
<TextInput placeholder="user's name " style={styles.one} underlineColorAndroid='transparent'
//--------------value Handler----------------//
onChangeText={(firstName) => this.setState({firstName})}
//---------------------------------//
/>
</View>
</View>
</ScrollView>
Seventh: {
height: 60,
width: '100%',
borderRadius: 70,
flexDirection: 'row',
elevation: 3,
backgroundColor: 'white',
marginTop:10
},
Eighth: {
height: 60,
width: '20%',
justifyContent: 'center',
alignItems: 'center'
},
Imagethird: {
height: 20,
width: 20,
resizeMode: 'contain',
},
ninth: {
height: 60,
width: '80%',
},
Textthird: {
marginRight:29,
marginTop: 10,
fontSize: 12,
color: '#C7C7CD'
},one:{
marginBottom:25,
fontWeight:'bold',
}
[1]: https://i.stack.imgur.com/Cq2wx.png
我认为问题出在边距上。我也有这个问题,发现文本输入有默认边距值,尝试将边距设置为 0,
<TextInput style={{margin:0,padding:0}} placeholder="place holder"/>