Android布局问题：RelativeLayout与FrameLayout的View对齐异常

首先你之前的布局问题出在同时设置了冲突的RelativeLayout对齐属性：android:layout_alignParentTop="true"、android:layout_alignTop="@id/stop_timeline_icon"、android:layout_above="@id/stop_timeline_icon"这三个规则相互矛盾，导致FrameLayout被挤压到父布局外部，完全不可见。先去掉这些冲突属性，再用下面的方法实现需求：

方法1：将ImageView的margin转移到父容器（推荐，结构更清晰） #

把ImageView的layout_marginTop移到一个新的父容器上，这样容器的顶部就是ImageView的可视顶部，直接让FrameLayout和这个容器对齐即可：

<RelativeLayout
    android:id="@+id/clickArea"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:clipToPadding="false"
    android:clipChildren="false"
    android:background="@drawable/menu_selector_background">

    <!-- 新增ImageView的父容器，把marginTop放在这里 -->
    <FrameLayout
        android:id="@+id/icon_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="18dp"
        android:layout_marginStart="16dp"
        android:layout_marginEnd="16dp">

        <ImageView
            android:id="@+id/stop_timeline_icon"
            android:layout_width="20dp"
            android:layout_height="wrap_content"
            android:src="@drawable/stop_icon"
            app:tint="@color/doveGrey"/>
    </FrameLayout>

    <!-- 对齐到容器顶部，也就是ImageView的可视顶部 -->
    <FrameLayout
        android:id="@+id/stop_timeline_top_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignStart="@id/icon_container"
        android:layout_alignEnd="@id/icon_container"
        android:layout_alignTop="@id/icon_container">

        <View
            android:id="@+id/stop_timeline_top"
            android:layout_width="2dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="@color/doveGrey" />

    </FrameLayout>

</RelativeLayout>

方法2：用相同的marginTop直接对齐（无需嵌套） #

保留原布局结构，给FrameLayout设置和ImageView一样的layout_marginTop，同时去掉冲突的对齐属性：

<RelativeLayout
    android:id="@+id/clickArea"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:clipToPadding="false"
    android:clipChildren="false"
    android:background="@drawable/menu_selector_background">

    <FrameLayout
        android:id="@+id/stop_timeline_top_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignStart="@id/stop_timeline_icon"
        android:layout_alignEnd="@id/stop_timeline_icon"
        <!-- 设置与ImageView相同的marginTop，对齐到可视顶部 -->
        android:layout_marginTop="18dp">

        <View
            android:id="@+id/stop_timeline_top"
            android:layout_width="2dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="@color/doveGrey" />

    </FrameLayout>

    <ImageView
        android:id="@+id/stop_timeline_icon"
        android:layout_marginTop="18dp"
        android:layout_width="20dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginEnd="16dp"
        android:src="@drawable/stop_icon"
        app:tint="@color/doveGrey"/>

</RelativeLayout>

方法3：改用ConstraintLayout（更灵活的布局方案） #

如果可以替换布局容器，ConstraintLayout能更精准控制对齐，直接让FrameLayout对齐到ImageView的顶部即可：

<androidx.constraintlayout.widget.ConstraintLayout
    android:id="@+id/clickArea"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:clipToPadding="false"
    android:clipChildren="false"
    android:background="@drawable/menu_selector_background">

    <FrameLayout
        android:id="@+id/stop_timeline_top_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintStart_toStartOf="@id/stop_timeline_icon"
        app:layout_constraintEnd_toEndOf="@id/stop_timeline_icon"
        <!-- 直接对齐到ImageView的可视顶部 -->
        app:layout_constraintTop_toTopOf="@id/stop_timeline_icon">

        <View
            android:id="@+id/stop_timeline_top"
            android:layout_width="2dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="@color/doveGrey" />

    </FrameLayout>

    <ImageView
        android:id="@+id/stop_timeline_icon"
        android:layout_marginTop="18dp"
        android:layout_width="20dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginEnd="16dp"
        android:src="@drawable/stop_icon"
        app:tint="@color/doveGrey"
        app:layout_constraintTop_toTopOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

内容的提问来源于stack exchange，提问作者Martin