布局看起来不同吗？

Question

我知道布局在不同的屏幕尺寸上看起来可能会有所不同，但是在制作此布局时并未考虑到这一点。 因此，默认情况下，它是为正常屏幕尺寸设计的，而我的手机屏幕也正常。

问题是，布局看起来与实际应该不同。 这是我手机上的情况，请注意四个图像按钮在右侧

这是应该的样子，如android studios布局工具所示。 注意，它很好地居中，应该是 ：

这是我的xml代码：

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.ruchir.circleswithmap.MainActivity"
    android:id="@+id/layout">

    <ImageButton
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:id="@+id/Blue"
        android:layout_marginTop="108dp"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginLeft="73dp"
        android:layout_marginStart="73dp"
        android:background="@drawable/bluecircle" />

    <ImageButton
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:id="@+id/Green"
        android:layout_below="@+id/Blue"
        android:layout_alignLeft="@+id/Blue"
        android:layout_alignStart="@+id/Blue"
        android:background="@drawable/greencircle" />

    <ImageButton
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:id="@+id/Red"
        android:layout_alignTop="@+id/Blue"
        android:layout_toRightOf="@+id/Blue"
        android:layout_toEndOf="@+id/Blue"
        android:background="@drawable/redcircle" />

    <ImageButton
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:id="@+id/Purple"
        android:layout_alignBottom="@+id/Green"
        android:layout_alignLeft="@+id/Red"
        android:layout_alignStart="@+id/Red"
        android:background="@drawable/purplesquare" />

</RelativeLayout>

为什么是这样？ 如何修复它，以便手机上的布局也应该居中对齐？ 非常感谢你的帮助！

Answer 1

加

android:gravity="center"

到您的RelativeLayout以将布局的内容居中并删除

android:layout_marginTop="108dp"
android:layout_marginLeft="73dp"
android:layout_marginStart="73dp"

如果要水平和垂直居中，请从第一个ImageButton开始。