RelativeLayout：两个FrameLayout元素的居中对齐

Question

在我的activity_main.xml中我有很多元素，其中我想要做出两个FrameLayout元素中心。如果我只有两个FrameLayout元素，它们正确居中。以下是显示的代码和屏幕截图：

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:gravity="center" 
    tools:context="com.abcd.testlayout.MainActivity"> 

    <FrameLayout 
     android:id="@+id/vertical_line" 
     android:background="@color/colorPrimary" 
     android:layout_width="50dp" 
     android:layout_height="280dp"> 
     <ImageButton 
      android:id="@+id/imageButton1" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center" 
      app:srcCompat="@android:drawable/presence_audio_away" /> 
    </FrameLayout> 

    <FrameLayout 
     android:id="@+id/vertical_line2" 
     android:background="@color/colorAccent" 
     android:layout_width="280dp" 
     android:layout_height="50dp" 
     android:layout_below="@+id/vertical_line"> 
     <ImageButton 
      android:id="@+id/imageButton2" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center" 
      app:srcCompat="@android:drawable/ic_lock_idle_alarm" /> 
    </FrameLayout> 

</RelativeLayout> 

正如你所看到的，我有两条线，一条垂直的蓝线和一条水平的粉红线。粉红线在水平方向居中，蓝线在垂直方向居中。这正是我想要的。

现在，如果我添加的所有其他元素的布局这里的代码，然后将截图：

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:gravity="center" 
    tools:context="com.abcd.testlayout.MainActivity"> 

    <FrameLayout 
     android:id="@+id/vertical_line" 
     android:background="@color/colorPrimary" 
     android:layout_width="50dp" 
     android:layout_height="280dp"> 
     <ImageButton 
      android:id="@+id/imageButton1" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center" 
      app:srcCompat="@android:drawable/presence_audio_away" /> 
    </FrameLayout> 

    <FrameLayout 
     android:id="@+id/vertical_line2" 
     android:background="@color/colorAccent" 
     android:layout_width="280dp" 
     android:layout_height="50dp" 
     android:layout_below="@+id/vertical_line"> 
     <ImageButton 
      android:id="@+id/imageButton2" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_gravity="center" 
      app:srcCompat="@android:drawable/ic_lock_idle_alarm" /> 
    </FrameLayout> 

    <ImageView 
     android:id="@+id/img1" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:scaleType="fitCenter" /> 

    <RelativeLayout 
     android:gravity="center" 
     android:id="@+id/rel" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent"> 

     <ImageView 
      android:id="@+id/imageView" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:adjustViewBounds="true" 
      android:antialias="true" 
      android:scaleType="matrix" /> 
    </RelativeLayout> 

    <ImageButton 
     android:id="@+id/img3" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginTop="20dp" 
     android:layout_alignParentTop="true" 
     android:layout_centerHorizontal="true" 
     app:srcCompat="@android:drawable/btn_default_small"/> 

    <ImageButton 
     android:id="@+id/imageButton4" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentStart="true" 
     android:layout_alignParentLeft="true" 
     android:layout_alignTop="@+id/imageButton" 
     android:layout_marginStart="42dp" 
     android:layout_marginLeft="42dp" 
     app:srcCompat="@android:drawable/arrow_up_float"/> 

    <ImageButton 
     android:id="@+id/imageButton" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="20dp" 
     android:layout_marginEnd="30dp" 
     android:layout_marginRight="30dp" 
     android:layout_above="@+id/seekBar" 
     android:layout_alignParentEnd="true" 
     android:layout_alignParentRight="true" 
     app:srcCompat="@android:drawable/arrow_down_float"/> 

    <SeekBar 
     android:id="@+id/seekBar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="40dp" 
     android:layout_marginLeft="40dp" 
     android:layout_marginRight="40dp" 
     android:max="100" 
     android:progress="0" 
     android:visibility="visible" 
     android:layout_alignParentBottom="true" 
     android:layout_alignParentStart="true" 
     android:layout_alignParentLeft="true" /> 

</RelativeLayout> 

正如你可以看到蓝色和红色的线移动到左上角，但我喜欢这两个元素的位置，以保持在前一个屏幕截图中的确切位置。

有没有办法做到这一点，这意味着将蓝色和红色线移动到与上一屏截图完全相同的位置，并保持其他元素的位置不变，而不尝试向这些元素添加左侧或按钮边距？适用于所有手机尺寸甚至平板电脑的东西，只需使用gravity:center或类似的东西？

Answer 1

裹在另一个RelativeLayout这两个意见如下：

<RelativeLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:gravity="center" 
    tools:context=".MainActivity"> 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:gravity="center" 
     tools:context=".MainActivity"> 

     <FrameLayout 
      android:id="@+id/vertical_line" 
      android:layout_width="50dp" 
      android:layout_height="280dp" 
      android:background="@color/colorPrimary"> 

      <ImageButton 
       android:id="@+id/imageButton1" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_gravity="center" 
       app:srcCompat="@android:drawable/presence_audio_away" /> 
     </FrameLayout> 

     <FrameLayout 
      android:id="@+id/vertical_line2" 
      android:layout_width="280dp" 
      android:layout_height="50dp" 
      android:layout_below="@+id/vertical_line" 
      android:background="@color/colorAccent"> 

      <ImageButton 
       android:id="@+id/imageButton2" 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_gravity="center" 
       app:srcCompat="@android:drawable/ic_lock_idle_alarm" /> 
     </FrameLayout> 
    </RelativeLayout> 

    <!-- Your other views --> 

</RelativeLayout>