java - Android Studio中的 fragment 在虚拟机中彼此堆叠

我必须将Unit Converter App变成片段并使其正常工作。一切都会编译，因此我可以在虚拟机中运行它。唯一的问题是所有xml视觉效果都堆叠在一起。我将提供代码以及其在虚拟机中的外观图片。请帮助我解决我的问题，以使它们不会堆叠在一起。

content_unit_converter.xml

<?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:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context="com.plamen.unitconverter.UnitConverterActivity"
tools:showIn="@layout/activity_unit_converter">

   <fragment
    android:id="@+id/unitconverterfragment"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:name="com.plamen.unitconverter.UnitConverterFragment"/>
<fragment
    android:id="@+id/unitcoverterdisplay"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:name="com.plamen.unitconverter.UnitConverterDisplay"/>

</RelativeLayout>

fragment_unit_converter.xml

<?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:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context="com.plamen.unitconverter.UnitConverterActivity"
tools:showIn="@layout/activity_unit_converter">

<RadioGroup
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/TemperatureEditText"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:id="@+id/radioGroup">


    <RadioButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="From Celsius to Farenheit"
        android:id="@+id/toFarenheitRadioButton"
        android:checked="true" />

    <RadioButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="From Farenheit to Celsius"
        android:id="@+id/toCelsiusRadioButton"
        android:checked="false" />
</RadioGroup>

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Convert"
    android:id="@+id/convertButton"
    android:layout_below="@+id/radioGroup"
    android:layout_centerHorizontal="true"/>

<Spinner
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/spinner1"
    android:spinnerMode="dropdown"
    android:layout_below="@+id/LengthEditText"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="false"
    android:layout_alignRight="@+id/LengthEditText"
    android:layout_alignEnd="@+id/LengthEditText"
    android:entries ="@array/length"

    />


<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="CONVERT"
    android:id="@+id/convertLength"
    android:layout_below="@+id/spinner1"
    android:layout_centerHorizontal="true"/>

<Spinner
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/spinner2"
    android:layout_below="@+id/AreaEditText"
    android:layout_centerHorizontal="true"
    android:entries ="@array/area"
    />

<Button
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Convert"
    android:id="@+id/convertArea"
    android:layout_below="@+id/spinner2"
    android:layout_centerHorizontal="true"/>

</RelativeLayout>

fragment_unit_converter_display.xml

<?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:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context="com.plamen.unitconverter.UnitConverterActivity"
tools:showIn="@layout/activity_unit_converter">

<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:inputType="numberDecimal"
    android:ems="10"
    android:id="@+id/TemperatureEditText"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:hint="Enter Temperature" />

<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:inputType="numberDecimal"
    android:ems="10"
    android:id="@+id/LengthEditText"
    android:hint="Enter Length"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true" />

<EditText
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:inputType="numberDecimal"
    android:ems="10"
    android:id="@+id/AreaEditText"
    android:layout_below="@+id/convertLength"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:hint="Enter Area" />

</RelativeLayout>

这是我在虚拟机中运行时的样子



这是我尝试android后的样子：layout_below
它也是重复的，我不知道为什么。

最佳答案

通常，无论何时使用相对布局，都必须指定要放置的位置。在线性布局中，添加新事物会将其放置在上一个元素的下方/附近（取决于您的方向），但是在相对布局中则不会发生。

所以你有这个：

<fragment
android:id="@+id/unitconverterfragment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:name="com.plamen.unitconverter.UnitConverterFragment"

/>
<fragment
android:id="@+id/unitcoverterdisplay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:name="com.plamen.unitconverter.UnitConverterDisplay"
/>

在这里，您仅显示2个片段，但不说哪个先行。

您可以添加此行或类似的行：

android:layout_below="@id/unitconverterfragment"

所以现在您将拥有：

<fragment
android:id="@+id/unitconverterfragment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:name="com.plamen.unitconverter.UnitConverterFragment"

/>
<fragment
android:id="@+id/unitcoverterdisplay"
android:layout_below="@id/unitconverterfragment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:name="com.plamen.unitconverter.UnitConverterDisplay"
/>

您可以将其放在下方，右侧，左侧，顶部等。