如何在圖像背景上更改按鈕的 position？

Question

在這里，我查看了添加圖像背景和兩個按鈕的視圖，我無法更改按鈕的 position

      <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 中的文本做同樣的事情，效果很好

Answer 1

如果你想讓你的按鈕水平和垂直居中，你可以像這樣改變你的 styles。 有關更多樣式選項，請參閱本文。

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

Answer 2

我遇到了同樣的問題，我改用了 touchableopacity 並且可以更改它，如果您想繼續使用按鈕，請嘗試將它們放在視圖中：

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

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