Android RelativeLayout将另一个视图右上角的一个视图的中心对齐

时间:2012-05-01 15:54:47

标签: android alignment android-relativelayout

我有使用RelativeLayout的经验,但我从来没有遇到过一种方法来解决我提出的问题(除了硬编码边距值,我想避免。)

我想尝试在RelativeLayout中创建类似下图的内容:

enter image description here

该框是它自己的视图,我想让包含橙色圆圈的视图居中于包含蓝色框的视图的右上角。

我尝试使用android:alignTop="boxView"android:alignRight="boxView"但是我的橙色圆圈完全放在我的框内。我希望它能让圆圈位于盒子右上角的中心位置。

有人知道如何通过RelativeLayout获得结果吗?最好不必将边距硬编码到屏幕边缘以获得橙色圆点视图。

3 个答案:

答案 0 :(得分:29)

此代码创建您要查找的内容,但确实使用了边距。现在,如果这是您正在创建的动态结构,则可以在代码中设置边距。如您所见,我使用负边距将右上角的形状移动到蓝框之外。这些需要是你想要移动的圆的一半高度。您可以在代码中执行所有操作,使圆圈位于右上角。

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >

        <LinearLayout
            android:id="@+id/linearLayout1"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_alignParentBottom="true"
            android:layout_alignParentLeft="true"
            android:background="#0000FF"
            android:orientation="vertical" >
        </LinearLayout>

        <LinearLayout
            android:layout_width="26dp"
            android:layout_height="26dp"
            android:layout_alignRight="@+id/linearLayout1"
            android:layout_alignTop="@+id/linearLayout1"
            android:layout_marginRight="-13dp"
            android:layout_marginTop="-13dp"
            android:background="#FF00FF"
            android:orientation="vertical" >
        </LinearLayout>

    </RelativeLayout>

答案 1 :(得分:1)

您可以使用ConstraintLayout圆形定位,只需将视图以45度角对齐并调整半径:

<androidx.constraintlayout.widget.ConstraintLayout 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"
    tools:context=".MainActivity">

    <LinearLayout
        android:background="@color/colorAccent"
        android:id="@+id/view"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <LinearLayout
        android:background="@color/colorPrimary"
        android:id="@+id/alignedView"
        android:layout_width="30dp"
        android:layout_height="30dp"
        app:layout_constraintCircle="@id/view"
        app:layout_constraintCircleAngle="45"
        app:layout_constraintCircleRadius="60dp" />

</androidx.constraintlayout.widget.ConstraintLayout>

答案 2 :(得分:1)

最好和正确的方法:

<androidx.constraintlayout.widget.ConstraintLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="@dimen/_10sdp">

    <View
        android:id="@+id/viewBox"
        android:layout_width="35dp"
        android:layout_height="35dp"
        android:background="@color/black"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent" />

    <View
        android:layout_width="15dp"
        android:layout_height="15dp"
        android:src="@drawable/ic_close"
        app:layout_constraintBottom_toTopOf="@+id/viewBox"
        app:layout_constraintLeft_toRightOf="@+id/viewBox"
        app:layout_constraintRight_toRightOf="@+id/viewBox"
        app:layout_constraintTop_toTopOf="@+id/viewBox" />

</androidx.constraintlayout.widget.ConstraintLayout>