分区RelativeLayout使RelativeLayout与RelativeLayout重叠

Question

注意：这似乎是一个重复的问题，但我没有找到一个回答我的问题/提供解决方案。

我有一个布局，我想设计如下：

这是我到目前为止所尝试的：

目前的布局设计：

下面找到相应的（尝试过的）XML布局（有问题）：

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

    <RelativeLayout
        android:id="@+id/layout_price"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_toEndOf="@id/layout_details">

        <TextView
            android:id="@+id/subscriptionCost"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentEnd="true"
            android:text="$ 0.00"
            android:textAlignment="textEnd"
            android:textSize="24sp" />

        <TextView
            android:id="@+id/currency"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/subscriptionCost"
            android:layout_alignParentEnd="true"
            android:text="(USD)"
            android:textAlignment="textEnd"
            android:textSize="16sp"
            android:textStyle="italic" />
    </RelativeLayout>


    <RelativeLayout
        android:id="@+id/layout_details"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true">

        <TextView
            android:id="@+id/subscriptionDuration"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentStart="true"
            android:text="2 Year Subscription"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium"
            android:textSize="24sp"
            android:textStyle="bold" />

        <TextView
            android:id="@+id/subscriptionMessage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/subscriptionDuration"
            android:layout_alignParentStart="true"
            android:text="Oon until Jaunarasdasddasdasd asd asdasdda sdasd asda sd as da sd as da sd a sd as d as d as d asdasdasday 2020"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium"
            android:textSize="16sp"
            android:textStyle="italic" />
    </RelativeLayout>

</RelativeLayout>

我认为我想要实现的布局是显而易见的，但我会解释。

布局是为了提供我的应用程序中提供的订阅的概述。

• 左上角的订阅持续时间，持续时间以下的更多详细信息（可以是多行的）。
• 订阅价格位于右上角，低于价格所在的货币。

问题

我有2个RelativeLayouts作为左右布局。左侧布局应该能够根据屏幕大小进行缩放，而右侧布局应该保持为wrap_content宽度。

将当前正确的RelativeLayout和子项作为wrap_content，看起来左侧RelativeLayout只是重叠并强制下面的正确布局，即使设置了android:layout_alignParentTop="true"和android:layout_alignParentEnd="true"。

我不确定是什么导致了这个问题，但任何建议都会受到赞赏。

Answer 1

不需要使用嵌套的RelativeLayout

你可以使用单个RelativeLayout

试试这个

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">


    <TextView
        android:id="@+id/subscriptionDuration"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_toStartOf="@id/subscriptionCost"
        android:text="2 Year Subscription"
        android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium"
        android:textSize="24sp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/subscriptionCost"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:text="$ 0.00"
        android:textAlignment="textEnd"
        android:textSize="24sp" />


    <TextView
        android:id="@+id/subscriptionMessage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/subscriptionDuration"
        android:layout_alignParentStart="true"
        android:layout_toStartOf="@id/currency"
        android:text="Oon until Jaunarasdasddasdasd asd asdasdda sdasd asda sd as da sd as da sd a sd as d as d as d asdasdasday 2020"
        android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium"
        android:textSize="16sp"
        android:textStyle="italic" />


    <TextView
        android:id="@+id/currency"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/subscriptionCost"
        android:layout_alignParentEnd="true"
        android:text="(USD)"
        android:textAlignment="textEnd"
        android:textSize="16sp"
        android:textStyle="italic" />

</RelativeLayout>

OUTPUT

Answer 2

嗨，经过一些检查，我会建议你使用ConstraintLayout：这里的完整代码符合你的要求

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:layout_height="wrap_content">


  <TextView
    android:id="@+id/subscriptionDuration"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentStart="true"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    android:text="2 Year Subscription"
    android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium"
    android:textSize="24sp"
    android:textStyle="bold"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

  <TextView

    android:id="@+id/subscriptionMessage"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_below="@id/subscriptionDuration"
    android:layout_alignParentStart="true"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    android:layout_marginEnd="8dp"
    android:text="Oon until Jaunarasdasddasdasd asd asdasdda sdasd asda sd as da sd as da sd a sd as d as d as d asdasdasday 2020"
    android:textAppearance="@style/Base.TextAppearance.AppCompat.Medium"
    android:textSize="16sp"
    android:textStyle="italic"
    app:layout_constraintEnd_toStartOf="@+id/currency"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/subscriptionDuration" />


  <TextView
    android:id="@+id/subscriptionCost"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentEnd="true"
    android:layout_marginEnd="8dp"
    android:text="$ 0.00"
    android:textAlignment="textEnd"
    android:textSize="24sp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toTopOf="@+id/subscriptionDuration" />

  <TextView
    android:id="@+id/currency"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@id/subscriptionCost"
    android:layout_alignParentEnd="true"
    android:layout_marginTop="8dp"
    android:layout_marginEnd="8dp"
    android:text="(USD)"
    android:textAlignment="textEnd"
    android:textSize="16sp"
    android:textStyle="italic"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/subscriptionCost" />

</android.support.constraint.ConstraintLayout>