ann*_*123 5 javascript css react-native
我正在基于本机的React上构建一个应用程序,我想在其中定位正确的位置
<View style={searchDrop}>
<TextInput
style={textInput}
placeholder="Search Coin"
onChangeText={(text) => this.onSearch(text)} />
<TouchableOpacity onPress={() => this.props.navigation.navigate("CurrencySelection")}>
<Text style={money}> <Icons name="money" size={35} color="#fbc02d" /> </Text>
</TouchableOpacity>
</View>
Run Code Online (Sandbox Code Playgroud)
具有以下样式
textInput: {
width: "70%",
height: 35,
marginLeft: 5,
marginRight: 5,
borderWidth: 0,
backgroundColor: "white",
borderRadius: 15,
textAlign: 'center'
},
searchDrop: {
paddingTop: 32,
paddingBottom: 5,
display: "flex",
flexDirection: "row",
height: 80,
backgroundColor: "#3b5998",
width: 100%
},
money: {
position: "absolute",
right: 0
}
Run Code Online (Sandbox Code Playgroud)
有了那个,我期待着
<Text style={money}> <Icons name="money" size={35} color="#fbc02d" /> </Text>
Run Code Online (Sandbox Code Playgroud)
位于屏幕的绝对右侧
这是现在的样子
只需这样做,它就会将图标移动到右侧。
<View style={styles.searchDrop}>
<TextInput
style={styles.textInput}
placeholder="Search Coin"
onChangeText={text => this.onSearch(text)}
/>
<TouchableOpacity
style={styles.money}
onPress={() => this.props.navigation.navigate('CurrencySelection')}>
<Text> <Icons name="money" size={35} color="#fbc02d"/> </Text>
</TouchableOpacity>
</View>
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
60 次 |
| 最近记录: |