如何在相對布局中將ImageButton放在居中的ImageButton上方

Question

我有一個居中的RelativeLayout我有一個ImageButton居中。 我想要第一個的右邊，但它雖然與頂部對齊，但似乎在屏幕的左邊。

我使用相對布局，因為我希望按鈕彼此相對。 （這是錯的嗎？）

我總共有四個按鈕。

#1 centered.
#2 to the right of #1
#3 above #2
#4 to the left of #3

像這樣

.................
.               .
.       43      .
.       12      .
.               .
.................

＃1居中。 當前看起來像這樣：

.................
.               .
.43             .
. 2     1       .
.               .
.................

• 我究竟做錯了什么？

這是布局文件：

<RelativeLayout
android:id="@+id/board_id"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/bg480x800"
android:orientation="vertical"
android:padding="0dp" >

<Button
    android:id="@+id/game_choice_6"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_below="@+id/game_choice_4" />

<Button
    android:id="@+id/game_choice_3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/game_choice_1" />

<Button
    android:id="@+id/game_choice_4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_below="@+id/game_choice_2" />

<Button
    android:id="@+id/game_choice_5"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_below="@+id/game_choice_3" />

<Button
    android:id="@+id/game_choice_1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_below="@id/square_layout_id"
    android:layout_centerVertical="true" />

<Button
    android:id="@+id/game_choice_2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_below="@id/square_layout_id" />

<com.brdgms.android.SquareLayout
    android:id="@+id/square_layout_id"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:background="#00000000" >

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent" >

        <ImageView
            android:id="@+id/game_board"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:contentDescription="game Board"
            android:src="@drawable/game_board" />

        <com.brdgms.android.games.game.GameBoardView
            android:id="@+id/game_canvas"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

        <ImageButton
            android:id="@+id/button_game_player_1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:src="@drawable/game_player_1_button" />

        <ImageButton
            android:id="@+id/button_game_player_2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/button_game_player_1"
            android:layout_toRightOf="@+id/button_game_player_1"
            android:layout_toEndOf="@+id/button_game_player_1"
            android:src="@drawable/game_player_2_button" />

        <ImageButton
            android:id="@+id/button_game_player_3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_above="@+id/button_game_player_2"
            android:layout_alignLeft="@+id/button_game_player_2"
            android:src="@drawable/game_player_3_button" />

        <ImageButton
            android:id="@+id/button_game_player_4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignBottom="@+id/button_game_player_3"
            android:layout_toLeftOf="@+id/button_game_player_3"
            android:src="@drawable/game_player_4_button" />

    </RelativeLayout>

</com.brdgms.android.SquareLayout>

</RelativeLayout>

Answer 1

為什么要使用相對布局？ 請改用線性布局。 將其水平放置，然后將linearlayout上的“ android：gravity”設置為居中。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:gravity="center"
          android:orientation="horizontal">

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/some_drawable"/>

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/some_drawable"/>

</LinearLayout>

Answer 2

嘗試這個.....

<RelativeLayout 
 xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent"
 android:layout_height="match_parent" >

    <ImageButton
     android:id="@+id/button_1"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_centerInParent="true"
     android:src="@drawable/image1" />          //--your image

    <ImageButton
     android:id="@+id/button_2"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_alignBottom="@+id/button_1"
     android:layout_toEndOf="@+id/button_1"
     android:layout_toRightOf="@+id/button_1"
     android:src="@drawable/image1" />         //--your image

    <ImageButton
     android:id="@+id/button_3"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_above="@+id/button_2"
     android:layout_toEndOf="@+id/button_1"
     android:layout_toRightOf="@+id/button_1"
     android:src="@drawable/image1" />         //--your image

    <ImageButton
     android:id="@+id/button_4"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:layout_above="@+id/button_1"
     android:layout_alignBottom="@+id/button_3"
     android:layout_toLeftOf="@+id/button_3"
     android:layout_toStartOf="@+id/button_3"
     android:src="@drawable/image1" />        //--your image

</RelativeLayout>

輸出...

Answer 3

我通過更改解決了問題

android:layout_width="wrap_content"

至

android:layout_width="match_parent"

在內部的RelativeLayout中。

這與按鈕無關，而與布局有關。 ：-/

Answer 4

布局xml代碼：

<ImageButton
    android:id="@+id/button_2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignTop="@+id/button_1"
    android:layout_toRightOf="@+id/button_1" />

<ImageButton
    android:id="@+id/button_3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignRight="@id/button_2"
    android:layout_above="@+id/button_2" />

<ImageButton
    android:id="@+id/button_4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@id/button_1"
    android:layout_alignLeft="@id/button_1"/>

這是預覽：