从右侧定位

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)

位于屏幕的绝对右侧

这是现在的样子

在此处输入图片说明

Hai*_*Ali 1

只需这样做,它就会将图标移动到右侧。

  <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)