我有一个商店布局,其中有三个不同大小的图像。在他们的右边,有代表价格的文字。如何将图像和文本对齐?并将屏幕中间放在图像和文本之间。这是我的布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" android:background="@drawable/podklad">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/lives"
android:focusable="false" android:background="@drawable/heart_image"
android:layout_below="@+id/money" android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="@+id/price1"
android:textSize="30sp" android:textColor="#ff000000"
android:layout_alignTop="@+id/lives" android:layout_toRightOf="@+id/lives"
android:layout_toEndOf="@+id/lives"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/money" android:layout_alignParentTop="true" android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" android:textSize="40dp" android:textColor="#ff000000"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/monstertoprightcolored"
android:id="@+id/hardmode"
android:layout_centerVertical="true" android:layout_centerHorizontal="true"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="@+id/price2"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_centerVertical="true"
android:layout_toRightOf="@+id/hardmode"
android:layout_toEndOf="@+id/hardmode"
android:layout_above="@+id/price3"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/monsterbottomleftcolored"
android:id="@+id/reversedmode"
android:layout_alignParentBottom="true" android:layout_alignLeft="@+id/hardmode"
android:layout_alignStart="@+id/hardmode"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="@+id/price3"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_marginTop="26dp"
android:layout_below="@+id/hardmode"
android:layout_toRightOf="@+id/price2"
android:layout_toEndOf="@+id/price2"/>
答案 0 :(得分:1)
在这种情况下,TableLayout
可能会更好。这是您的布局的开始:
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="*">
<TableRow>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_span="2"
android:layout_gravity="right"
android:id="@+id/money"
android:textSize="40dp"
android:textColor="#ff000000"
tools:text="money" />
</TableRow>
<TableRow>
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="@+id/lives"
android:focusable="false"
android:background="@drawable/heart_image"
/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="@+id/price1"
android:textSize="30sp"
android:textColor="#ff000000"
tools:text="price1" />
</TableRow>
<TableRow>
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/monstertoprightcolored"
android:id="@+id/hardmode" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="@+id/price2"
android:textSize="30dp"
android:textColor="#ff000000"
tools:text="price2" />
</TableRow>
<TableRow>
<ImageButton
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="@drawable/monsterbottomleftcolored"
android:id="@+id/reversedmode" />
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="@+id/price3"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_marginTop="26dp"
tools:text="price3" />
</TableRow>
</TableLayout>
请注意,为了“将屏幕中间放在图像和文本之间”,两列的宽度必须相等。这可以通过在android:stretchColumns="*"
中设置TableLayout
,在android:layout_width="0dp"
的子项中设置android:layout_weight="1"
和TableRow
来完成。
有关详细信息,请参阅tablelayout - Set equal width of columns in table layout in Android。
答案 1 :(得分:0)
您可以使用线性布局。图像和文本可以以线性布局垂直分割。每个线性布局都可以水平放置。您能否添加一个截图,说明您的布局应该如何更好地理解。
答案 2 :(得分:0)
在这里试试这个,希望能帮助你,我希望我能正确理解你的问题。
<?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:orientation="vertical"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:background="@drawable/ic_launcher">
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/lives"
android:focusable="false"
android:background="@drawable/ic_launcher"
android:layout_below="@+id/money"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="@+id/price1"
android:textSize="30sp"
android:text="Text"
android:textColor="#ff000000"
android:layout_alignTop="@+id/lives"
android:layout_toRightOf="@+id/lives"
android:layout_toEndOf="@+id/lives" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/money"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textSize="40dp"
android:text="Text"
android:textColor="#ff000000" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/ic_launcher"
android:id="@+id/hardmode"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="@+id/price2"
android:textSize="30dp"
android:textColor="#ff000000"
android:text="Text"
android:layout_centerVertical="true"
android:layout_toRightOf="@+id/hardmode"
android:layout_toEndOf="@+id/hardmode"
android:layout_above="@+id/price3" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@drawable/ic_launcher"
android:id="@+id/reversedmode"
android:layout_alignParentBottom="true"
android:layout_alignLeft="@+id/hardmode"
android:layout_alignStart="@+id/hardmode" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="@+id/price3"
android:textSize="30dp"
android:textColor="#ff000000"
android:layout_marginTop="26dp"
android:layout_below="@+id/hardmode"
android:text="Text"
android:layout_toRightOf="@+id/price2"
android:layout_toEndOf="@+id/price2" />
</LinearLayout>