如何修复重叠的对象答案

【问题标题】：How to fix overlapping objects如何修复重叠的对象
【发布时间】：2017-08-22 22:55:43
【问题描述】：

我最近开始了解如何在 Android Studio 中编码，并想设置基本编码。我创建了 2 个数字对象和 1 个按钮，1 个纯文本对象。无需编写任何代码，当我单击 Android Studio 上的 Run App 按钮并选择任何 Emulator 时，所有对象都会相互堆叠。有没有简单的方法来解决这个问题？

以下是activity_main.xml中的文字：

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.myapplication70.MainActivity">

    <EditText
        android:id="@+id/editText3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:hint="Result"
        android:inputType="numberDecimal"
        tools:layout_editor_absoluteX="67dp"
        tools:layout_editor_absoluteY="223dp" />

    <EditText
        android:id="@+id/editText1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="number"
        tools:layout_editor_absoluteX="67dp"
        tools:layout_editor_absoluteY="60dp" />

    <EditText
        android:id="@+id/editText2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="numberSigned"
        tools:layout_editor_absoluteX="67dp"
        tools:layout_editor_absoluteY="134dp" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        tools:layout_editor_absoluteX="100dp"
        tools:layout_editor_absoluteY="319dp" />

</android.support.constraint.ConstraintLayout>

【问题讨论】：

你不能仅仅因为它在布局生成器中看起来不错就期望它能够工作；）。 Android 有许多不同的屏幕尺寸和格式，您必须牢记。我看到您选择了 ConstraintLayout（可能是因为您熟悉与 iOS InterfaceBuilder 类似的工作流程？）但是对于刚开始使用 Android 的人来说，这种布局可能很难理解。我建议您查看 LinearLayout：developer.android.com/guide/topics/ui/layout/linear.html
查看此文档以了解最佳约束布局。 medium.com/exploring-android/…
感谢您的信息。我没有选择任何约束布局，这是默认设置的 Android Studio IDE。因此我提到了 AS 版本号 :)
任何快速解决方案？

标签： android android-layout android-constraintlayout

【解决方案1】：

您正在使用约束布局作为主布局，这意味着布局中的元素将根据约束进行放置，请查看Android Documentation 以了解使用约束布局。

【讨论】：

添加：在编辑器中它看起来不错，因为（生成的）tools:layout_editor_absolute 属性。工具命名空间中的任何属性都仅适用于编辑器。他们没有进入apk。所以，是的，您需要约束来正确布置孩子或选择不同的布局。
是的，我现在明白了。如果我找到正确的文档，我会更新这篇文章，它应该有助于避免像我这样的其他新手头疼。谢谢一堆。 :-D

【解决方案2】：

正如@RobCo 提到的，tools 命名空间属性仅适用于编辑器：

当您构建应用程序时，构建工具会删除这些属性，以便对您的 APK 大小或运行时行为没有影响。

当您在布局编辑器中移动视图时，布局文件中的tools:layout_editor_absolute 属性会自动生成，仅供您在设计布局时用作参考。

相反，您应该利用app:layout_constraint... 属性，该属性也可以在布局编辑器中创建。我建议您查看training documentation 以了解如何执行此操作。

否则，正如@nbokmans 所述，您可能需要考虑LinearLayout；这可能会让你更容易理解。

【讨论】：

我想这涉及到更多的阅读和学习，不能仅仅依赖 IDE 提供的默认选项。感谢您的更新:)

【解决方案3】：

查看您的布局，您目前缺少约束。约束对于使对象保持在与它们在实际设备上的编辑器中相同的位置是关键。

您可以通过拖放手动添加它们来创建它们，或者使用“推断约束”自动添加它们

【讨论】：

【解决方案4】：

在约束布局中，您可以使用蓝图调整对象轻松克服重叠。例如。选择一个对象并使用指向箭头（拖动时会找到）拖动到顶部边缘，然后拖动到左侧边缘、右侧边缘和底部边缘，然后您现在可以调整对象的位置。

【讨论】：

【解决方案5】：

删除您所有的 tools:layout_editor_absoluteX 和 tools:layout_editor_absoluteY 属性。

根据Documentation

当您构建应用程序时，构建工具会删除这些属性，以便对您的 APK 大小或运行时行为没有影响

如果您想根据显示的预览并使用 ConstraintLayout 对齐所有属性，我建议您了解更多关于 ConstraintLayout 以及如何使用 Build a Responsive UI with 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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.myapplication70.MainActivity">

    <EditText
        android:id="@+id/editText1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="32dp"
        android:ems="10"
        android:inputType="number"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <EditText
        android:id="@+id/editText2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="32dp"
        android:ems="10"
        android:inputType="numberSigned"
        app:layout_constraintEnd_toEndOf="@+id/editText1"
        app:layout_constraintStart_toStartOf="@+id/editText1"
        app:layout_constraintTop_toBottomOf="@+id/editText1" />

    <EditText
        android:id="@+id/editText3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="32dp"
        android:ems="10"
        android:hint="Result"
        android:inputType="numberDecimal"
        app:layout_constraintEnd_toEndOf="@+id/editText2"
        app:layout_constraintStart_toStartOf="@+id/editText2"
        app:layout_constraintTop_toBottomOf="@+id/editText2" />

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="32dp"
        android:text="Button"
        app:layout_constraintEnd_toEndOf="@+id/editText3"
        app:layout_constraintStart_toStartOf="@+id/editText3"
        app:layout_constraintTop_toBottomOf="@+id/editText3" />

</android.support.constraint.ConstraintLayout>

【讨论】：

【解决方案6】：

在 android studio 中，您有一个名为“推断约束”的按钮。

按下该按钮，它会自动为您放置约束。

【讨论】：