Space 以上 ConstraintLayout 中的元素

Question

我的情况是 ConstraintLayout 中的 UI 元素上方有一些随机 space。在图像中 - 查看 textInput 和 seekBar 元素上方的 space。

我们正在构建一种基于类型的自定义字段 - 例如数字输入、文本输入、开关等。我们根据收到的 JSONArray 字段类型和内容动态构建表单。

除了三种类型：数字输入、文本输入和滑块 (seekBar) 之外，一切都完美构建。我没有提供生成表单的代码，因为我认为如果该代码中有内容，那么每个片段上方都会有这个 space，而不仅仅是这三种特定类型。

这是数字输入的布局文件（除了输入类型和元素 id 外，它与文本输入的布局文件完全相同）：

<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="our.package.name.custom_fields.type_slider.SliderFragment">

<TextView
    android:id="@+id/displayText"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:textAppearance="@style/Base.TextAppearance.AppCompat.Subhead"
    android:visibility="gone"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<android.support.design.widget.TextInputLayout
    android:id="@+id/input_layout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/displayText">

    <android.support.design.widget.TextInputEditText
        android:id="@+id/number_input"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="number" />

</android.support.design.widget.TextInputLayout>
</android.support.constraint.ConstraintLayout>

这是 SeekBar 的布局文件：

<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="our.package.name.custom_fields.type_slider.SliderFragment">

<TextView
    android:id="@+id/displayText"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:textAppearance="@style/Base.TextAppearance.AppCompat.Subhead"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<SeekBar
    android:id="@+id/slider_view"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/displayText" />

</android.support.constraint.ConstraintLayout>

有什么想法吗？

Answer 1

你要求 TextView 在他的 parent 中居中，然后你要求 TextInputLayout 低于 @+id/displayText。
尝试更改此控制器的中心：

<TextView
    android:id="@+id/displayText"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:textAppearance="@style/Base.TextAppearance.AppCompat.Subhead"
    android:visibility="gone"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent" />

Answer 2

解决方案最终成为我链接元素的方式。

我认为 TextView 是 "anchor" 所以我将它的顶部、左侧、右侧和底部限制在父级。然后我将其他元素链接到它 - TextInputLayout 的顶部被限制到 TextView 的底部。

当我改变它时，space 问题就解决了。

所以现在，TextInputLayout 的顶部、左侧、右侧和底部受限于父级，TextView 的底部受限于 TextInputLayout。

看：

<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="our.package.name.custom_fields.type_slider.SliderFragment">

<TextView
    android:id="@+id/displayText"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:textAppearance="@style/Base.TextAppearance.AppCompat.Subhead"
    app:layout_constraintBottom_toTopOf="@+id/input_layout"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<android.support.design.widget.TextInputLayout
    android:id="@+id/input_layout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintBottom_toBottomOf="parent">

    <android.support.design.widget.TextInputEditText
        android:id="@+id/text_input"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:inputType="textCapSentences" />

</android.support.design.widget.TextInputLayout>
</android.support.constraint.ConstraintLayout>

Space 以上 ConstraintLayout 中的元素

Space above elements in ConstraintLayout

android

android-layout

android-constraintlayout