如何更改图像背景上按钮的位置？答案

【问题标题】：how can change position of a button over an imagebackground?如何更改图像背景上按钮的位置？
【发布时间】：2021-05-07 01:53:00
【问题描述】：

在这里，我查看了添加图像背景和两个按钮的视图，但我无法更改按钮的位置

      <ImageBackground
        style={styles.container}
        resizeMode="cover"
        source={require("../../assets/loginsignup.png")}
      >
        <Button
          style={styles.button}
          title=""
          onPress={() => navigation.navigate("Login")}
        />
        <Button title="" onPress={() => navigation.navigate("Register")} />
        
      </ImageBackground>
    </View>

这是我实现的风格

  container: {
    width: "100%",
    height: "100%",
    position: "relative",
    top: 0,
    left: 0,
  },
  button: {
    width: "100%",
    height: "100%",
    position: "absolute",
    top: 345,
  },
});

我尝试对 imagebackground 中的文本做同样的事情，效果很好

【问题讨论】：

标签： javascript node.js react-native expo

【解决方案1】：

如果你想让你的按钮水平和垂直居中，你可以像这样改变你的样式。有关更多样式选项，请参阅 this 文章。

container: {
    flex : 1,
    position: "relative",
    alignItems : 'center', // Vertically
    justifyContent : 'center', // Horizontally  
    top: 0,
    left: 0,
  },

【讨论】：

【解决方案2】：

我遇到了同样的问题，我使用了 touchableopacity，我可以更改它，如果您想继续使用按钮，请尝试将它们放在视图中：

<View style={{flex:1,alignItems:'where you want'}} 
 //your buttons
  </View>

您也可以使用 flexDirection 列或行告诉我这是否有效

【讨论】：