我试图弄清楚如何使用react-native-elements像文档中显示的图片一样设置输入的样式...我希望输入看起来像带有白色背景的顶部输入,但是我没有知道我将如何去做。我遇到的主要问题是在输入容器上弄尖的边缘。有什么帮助吗?
答案 0 :(得分:1)
我不知道该怎么做,但是我认为ImageBackground
可以解决问题。我将其用作问题图片,因为我没有image
。
import * as React from 'react';
import { Text, View, StyleSheet,TextInput,ImageBackground } from 'react-native';
import Constants from 'expo-constants';
export default class App extends React.Component {
render() {
return (
<View style={styles.container}>
<Text style={styles.paragraph}>
Use ImageBackground
</Text>
<ImageBackground style={{height: 40 , width:"100%"}} source={require("./test.png")}>
<TextInput style={{height: 40,color:"red",paddingHorizontal:120}} />
</ImageBackground>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
paddingTop: Constants.statusBarHeight,
backgroundColor: '#ecf0f1',
padding: 8,
},
paragraph: {
margin: 24,
fontSize: 18,
fontWeight: 'bold',
textAlign: 'center',
},
});