Question

我的布局包含矩形图像和相对布局，其中包含图像和文本视图。此布局将包含在另一个布局中。我希望布局的左下角与我的矩形图像的中心位于相同的位置。

在android studio设计预览中，我通过以下布局实现了这一目标。

<?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">
    <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/my_center_image"
            android:src="@drawable/my_center_image"
            android:layout_centerInParent="true"/>
    <TextView
            android:layout_width="1px"
            android:layout_height="1px"
            android:id="@+id/placeholder"
            android:layout_centerInParent="true"
            android:background="@null"/>
    <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/second_placeholder"
            android:layout_toRightOf="@+id/placeholder"
            android:layout_above="@+id/placeholder">
        <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/my_image"
                android:background="@drawable/my_image"
                android:layout_centerInParent="true"/>
        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="20"
                android:id="@+id/count"
                android:textColor="@android:color/white"
                android:layout_centerInParent="true"
                android:textSize="10dp"/>
    </RelativeLayout>
</RelativeLayout>

在真实的设备中，这显示不正确，我可以实现的最好的模仿我想要的是以下布局：

<?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">

    <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/my_center_image"
            android:src="@drawable/my_center_image"
            android:layout_centerVertical="true"
            android:layout_marginTop="10dp"/>

    <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/placeholder"
            android:layout_marginLeft="10dp">

        <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@+id/my_image"
                android:background="@drawable/my_image"
                android:layout_centerInParent="true"/>

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="20"
                android:id="@+id/count"
                android:textColor="@android:color/white"
                android:layout_centerInParent="true"
                android:textSize="10dp"/>
    </RelativeLayout>

</RelativeLayout>

有人可以帮我理解我该怎么做，所以我可以将布局的左下角放在图像的中心吗？

Answer 1

What should I do so I can place the bottom left corner of a layout in the center of an image?

您可以在屏幕中央放置一般视图（1dp宽和1dp高）将ImageView也放在中心位置通用视图是不可见的，但必须具有唯一的ID 然后将布局设置为视图的右侧和顶部。

如下图所示：

<?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"
    >
    <View
        android:layout_width="1dp"
        android:layout_height="1dp"
        android:id="@+id/my_center_view"
        android:layout_centerInParent="true"
    >
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/my_center_image"
        android:src="@drawable/my_center_image"
        android:layout_centerInParent="true"
    />

    <RelativeLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/placeholder"
        android:layout_toRightOf="my_center_view"
        android:layout_above="my_center_view"
        >
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/my_image"
            android:background="@drawable/my_image"
            android:layout_centerInParent="true"
        />
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="20"
            android:id="@+id/count"
            android:textColor="@android:color/white"
            android:layout_centerInParent="true"
            android:textSize="10dp"
        />
    </RelativeLayout>
</RelativeLayout>

这听起来很复杂，但事实并非如此它只是利用了RelativeLayout子节点继承的相对性。

Android左下角的相对布局在与图像中心相同的位置

1 个答案: