在包含在 ScrollView 中的 ConstraintLayout 中添加约束会切断底部答案

【问题标题】：Adding constraint in ConstraintLayout wrapped in ScrollView cuts off bottom在包含在 ScrollView 中的 ConstraintLayout 中添加约束会切断底部
【发布时间】：2017-11-28 14:52:51
【问题描述】：

我将 ConstraintLayout 包裹在 ScrollView 中。但是，如果我添加约束并且没有约束，则会切断最后一个小部件，它将向下滚动而不切断。

下图是有约束的。所有小部件都以相同的方式连接到顶部。不管距离有多大。

这是没有约束的图片。

我尝试了边距和填充。添加填充后，它只是在底部工具栏上方创建了空白区域。我还尝试重新启动 AndroidStudio 并使缓存/重新启动无效。到目前为止没有成功。

这是代码

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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:fillViewport="true"
    tools:context="com.example.boss.abeacon.DataAcquisitionActivity">

    <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="wrap_content"
        tools:context="com.example.boss.abeacon.DataAcquisitionActivity">

        <EditText
            android:id="@+id/yCoordinate_editor"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:digits="0123456789"
            android:ems="10"
            android:imeOptions="actionDone"
            android:inputType="numberSigned"
            android:textSize="12sp"
            app:layout_constraintStart_toStartOf="@+id/position_id_editor"
            app:layout_constraintTop_toBottomOf="@+id/xCoordinate_editor" />

        <EditText
            android:id="@+id/xCoordinate_editor"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:digits="0123456789"
            android:ems="10"
            android:imeOptions="actionDone"
            android:inputType="numberSigned"
            android:textSize="12sp"
            app:layout_constraintStart_toStartOf="@+id/position_id_editor"
            app:layout_constraintTop_toBottomOf="@+id/position_id_editor" />

        <TextView
            android:id="@+id/label_number_of_data_editor"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="8dp"
            android:text="Number of data \nin a position"
            app:layout_constraintBottom_toBottomOf="@+id/number_of_data_editor"
            app:layout_constraintEnd_toStartOf="@+id/number_of_data_editor" />

        <EditText
            android:id="@+id/inliers_window_editor"
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="16dp"
            android:digits="1234567890"
            android:ems="10"
            android:hint="#"
            android:imeOptions="actionDone"
            android:inputType="number"
            android:textSize="12sp"
            app:layout_constraintStart_toStartOf="@+id/room_name_editor"
            app:layout_constraintTop_toBottomOf="@+id/number_of_data_editor" />

        <TextView
            android:id="@+id/label_inliers_window_editor"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:layout_marginEnd="8dp"
            android:text="Inliers' window size"
            app:layout_constraintBottom_toBottomOf="@+id/inliers_window_editor"
            app:layout_constraintEnd_toStartOf="@+id/inliers_window_editor" />

        <TextView
            android:id="@+id/label_minor_bracon_editor"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="8dp"
            android:text="Minor values \nof beacons"
            app:layout_constraintBottom_toBottomOf="@+id/minor_beacon_editor"
            app:layout_constraintEnd_toStartOf="@+id/minor_beacon_editor" />

        <EditText
            android:id="@+id/number_of_data_editor"
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="16dp"
            android:digits="1234567890"
            android:ems="10"
            android:hint="#"
            android:imeOptions="actionNext"
            android:inputType="number"
            android:textSize="12sp"
            app:layout_constraintStart_toStartOf="@+id/room_name_editor"
            app:layout_constraintTop_toBottomOf="@+id/minor_beacon_editor" />

        <EditText
            android:id="@+id/minor_beacon_editor"
            android:layout_width="150dp"
            android:layout_height="0dp"
            android:layout_marginTop="16dp"
            android:digits="1234567890 "
            android:ems="10"
            android:hint="1 2 3 10 21"
            android:imeOptions="actionNext"
            android:inputType="number"
            android:textSize="12sp"
            app:layout_constraintStart_toStartOf="@+id/room_name_editor"
            app:layout_constraintTop_toBottomOf="@+id/room_name_editor" />

        <TextView
            android:id="@+id/label_position_id_editor"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:layout_marginEnd="8dp"
            android:text="Position ID"
            app:layout_constraintBottom_toBottomOf="@+id/position_id_editor"
            app:layout_constraintEnd_toStartOf="@+id/position_id_editor" />

        <EditText
            android:id="@+id/position_id_editor"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:digits="0123456789"
            android:ems="10"
            android:imeOptions="actionDone"
            android:inputType="number"
            android:textSize="12sp"
            app:layout_constraintStart_toStartOf="@+id/room_name_editor"
            app:layout_constraintTop_toBottomOf="@+id/auto_position_id_checkBox" />

        <TextView
            android:id="@+id/label_room_name_editor"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:layout_marginEnd="8dp"
            android:text="Room name"
            app:layout_constraintBottom_toBottomOf="@+id/room_name_editor"
            app:layout_constraintEnd_toStartOf="@+id/room_name_editor" />

        <EditText
            android:id="@+id/room_name_editor"
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:layout_marginStart="150dp"
            android:layout_marginTop="32dp"
            android:ems="10"
            android:hint="Enter file name"
            android:inputType="textPersonName"
            android:textSize="12sp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <Button
            android:id="@+id/scan_btn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="32dp"
            android:layout_marginStart="32dp"
            android:text="Start"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            tools:layout_editor_absoluteY="515dp" />

        <TextView
            android:id="@+id/kazoeru"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="20dp"
            android:layout_marginStart="32dp"
            android:text="#"
            app:layout_constraintBottom_toTopOf="@+id/scan_btn"
            app:layout_constraintStart_toStartOf="parent" />

        <CheckBox
            android:id="@+id/auto_position_id_checkBox"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="32dp"
            android:text="Auto position ID"
            android:textSize="12sp"
            app:layout_constraintStart_toStartOf="@+id/position_id_editor"
            app:layout_constraintTop_toBottomOf="@+id/setParameters_btn" />

        <TextView
            android:id="@+id/last_position_id"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:layout_marginStart="8dp"
            android:textSize="12sp"
            app:layout_constraintBottom_toBottomOf="@+id/position_id_editor"
            app:layout_constraintStart_toEndOf="@+id/position_id_editor" />

        <TextView
            android:id="@+id/label_xCoordinate_editor"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:layout_marginEnd="8dp"
            android:text="X"
            app:layout_constraintBottom_toBottomOf="@+id/xCoordinate_editor"
            app:layout_constraintEnd_toStartOf="@+id/xCoordinate_editor" />

        <TextView
            android:id="@+id/label_yCoordinate_editor"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:layout_marginEnd="8dp"
            android:text="Y"
            app:layout_constraintBottom_toBottomOf="@+id/yCoordinate_editor"
            app:layout_constraintEnd_toStartOf="@+id/yCoordinate_editor" />

        <TextView
            android:id="@+id/last_xCoordinate"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:layout_marginStart="8dp"
            app:layout_constraintBottom_toBottomOf="@+id/xCoordinate_editor"
            app:layout_constraintStart_toEndOf="@+id/xCoordinate_editor" />

        <TextView
            android:id="@+id/last_yCoordinate"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:layout_marginStart="8dp"
            app:layout_constraintBottom_toBottomOf="@+id/yCoordinate_editor"
            app:layout_constraintStart_toEndOf="@+id/yCoordinate_editor" />

        <Button
            android:id="@+id/setParameters_btn"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginEnd="32dp"
            android:layout_marginStart="32dp"
            android:layout_marginTop="8dp"
            android:onClick="setParametersButtonOnClick"
            android:text="Set parameters"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/inliers_window_editor" />
    </android.support.constraint.ConstraintLayout>
</ScrollView>

我正在运行 Ubuntu 16.04.LTS 和最新版本的 AndroidStudio。

【问题讨论】：

你试过按钮上的app:layout_constraintBottom_toBottomOf="Parent"吗？
@Adam 我希望按钮和最后一个小部件之间的距离为 32dp。添加app:layout_constraintBottom_toBottomOf="Parent" 并不能真正解决问题。有了这个，我可以看到按钮的文本，但按钮的其余部分仍然被切断。

标签： android android-scrollview android-constraintlayout

【解决方案1】：

更新该布局适用于最新的 beta 版本。升级到 1.1.0-beta3 即可解决问题。

关于设计器布局的差异，请查看scan_btn 的 XML。如果没有顶部约束，设计者会在其上施加一个位置，即距顶部 515dp。这只是为了在设置所有约束之前将事情保持在适当的位置。

tools:layout_editor_absoluteY="515dp"

当您使用32dp 约束顶部时，不会使用上面的设计器位置，而是使用来自上部小部件的32dp。这将解释有和没有顶部约束的位置差异。您必须约束顶部，否则小部件将浮动到顶部，因为设计器约束在设计器中不起作用，因此请选择适合您的顶部约束和顶部边距。

【讨论】：

亲爱的@Cheticamp 无论我在哪里添加约束，问题仍然存在。无论距离多远，我都只能看到按钮的一角。除了布局的最顶部和从顶部开始的第一个小部件的底部。
@Filipko 你用的是什么版本的ConstraintLayout？您是在模拟器/设备上还是在设计器中看到问题？带有约束的图像似乎只是向上滚动。我真的看不出有什么区别。这就是为什么我有兴趣了解您是否在模拟器/设备上看到问题。
我从布局顶部android:layout_marginTop="530dp"设置按钮scan_btn的约束并添加新按钮，与scan_btn相同（ctrl+c ctrl+v）并设置其顶部约束到scan_btn 的底部。现在好了。但是，当我将scan_btn 的顶部约束更改为最后一个witged 的底部时，新按钮被切断...
@Filipko 看起来这两个图像之间的唯一区别是一个向上滚动而另一个没有。我可以说出来，因为一个顶部的字段是“信标的次要值”，而另一个顶部的字段是“某个位置的数据数”，这是“信标的次要值”下面的字段。在任何情况下，您都必须在 ConstraintLayout 中垂直和水平地约束每个小部件，因此您不应依赖较大的边距来定位您的按钮。将其约束到有意义的小部件并使其工作。将它放在模拟器中，看看事物的真实外观和滚动方式。
我在真机HUAWEI P9上测试，所以你在图片中看到的和我在设备上看到的一样。所有小部件都有垂直和水平约束。第一个小部件受限于布局，所有其他小部件都受限于它。我做错约束了吗？