ScrollView 在 ConstraintLayout 中无法正常工作

Question

我在ConstraintLayout中放置了一个ScrollView，但是它并没有起作用。我尝试使用NestedScrollView代替ScrollView，但仍然无效。ScrollView在LinearLayout或RelativeLayout中运行良好，但在ConstraintLayout中不起作用。我已经将android:layout_height更改为match_parent和wrap_content，但仍然无效。问题出在哪里？

<androidx.constraintlayout.widget.ConstraintLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    >

    <include
        android:id="@+id/other_toolbar_xml"
        layout="@layout/other_toolbar_xml"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        />

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toBottomOf="@id/other_toolbar_xml"
        android:fillViewport="true"
        tools:ignore="MissingConstraints"
        >

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            >

            <ImageView
                android:id="@+id/img_content_xml"
                android:layout_width="match_parent"
                android:layout_height="170dp"
                app:layout_constraintTop_toBottomOf="@id/other_toolbar_xml"
                android:scaleType="fitXY"
                tools:ignore="NotSibling"
                />

            <TextView
                android:id="@+id/title_content_xml"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="16dp"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@id/img_content_xml"
                android:layout_marginRight="16dp"
                android:paddingLeft="16dp"
                android:textDirection="rtl"
                android:text="title"
                android:textSize="17sp"
                android:textColor="#1d1d1d"
                />

            <TextView
                android:id="@+id/content_content_xml"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@id/title_content_xml"
                android:layout_marginTop="20dp"
                android:layout_marginRight="16dp"
                android:layout_marginEnd="16dp"
                android:paddingLeft="16dp"
                android:textDirection="rtl"
                android:text="content"
                android:textColor="#1d1d1d"
                />

            <ImageView
                android:id="@+id/img_date_content_Xml"
                android:layout_width="18dp"
                android:layout_height="18dp"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@id/content_content_xml"
                android:layout_marginTop="20dp"
                android:layout_marginRight="16dp"
                android:layout_marginEnd="16dp"
                android:layout_marginBottom="16dp"
                android:src="@drawable/date"
                />

            <TextView
                android:id="@+id/date_content_xml"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_constraintTop_toBottomOf="@id/content_content_xml"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintRight_toLeftOf="@id/img_date_content_Xml"
                android:layout_marginTop="20dp"
                android:layout_marginRight="8dp"
                android:layout_marginEnd="8dp"
                android:text="date"
                android:textColor="#1d1d1d"
                android:layout_marginBottom="16dp"
                />

            <TextView
                android:id="@+id/subject_content_xml"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                app:layout_constraintTop_toBottomOf="@id/content_content_xml"
                app:layout_constraintLeft_toLeftOf="parent"
                android:layout_marginTop="20dp"
                android:layout_marginStart="16dp"
                android:layout_marginLeft="16dp"
                android:singleLine="true"
                android:text="subject"
                android:textColor="#1d1d1d"
                />

        </androidx.constraintlayout.widget.ConstraintLayout>
    </ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

- Farid

Answer 1

您在<ScrollView标记中添加了tools:ignore="MissingConstraints"，这意味着您忽略了某些必要的约束。

有两种方法可以解决：

1. Remove Parent Constraint Layout and use RelativeLayout as no need of ConstraintLayout in just two layouts. (It is mostly used for complex view to make it easy)

2. Give proper constraint if you want to use ConstraintLayout. You missed left, right, bottom constraint as follow:

   <ScrollView
       android:layout_width="match_parent"
       android:layout_height="0dp"
       android:fillViewport="true"        
       app:layout_constraintTop_toBottomOf="@id/other_toolbar_xml"
       app:layout_constraintBottom_toBottomOf="parent"
       app:layout_constraintEnd_toEndOf="parent"
       app:layout_constraintStart_toStartOf="parent" >
   
   //....
   
   </ScrollView>
   

- Pratik Butani

Answer 2

首先，如果您使用constraintlayout作为父布局，则需要适当约束子视图。Scrollview没有被正确约束，这就是为什么滚动视图无法工作。

这是我的代码：

<androidx.constraintlayout.widget.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">

    <include
        android:id="@+id/other_toolbar_xml"
        layout="@layout/toolbar_back"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize" />

    <ScrollView
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:fillViewport="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@id/other_toolbar_xml"
        tools:ignore="MissingConstraints">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <ImageView
                android:id="@+id/img_content_xml"
                android:layout_width="match_parent"
                android:layout_height="170dp"
                android:scaleType="fitXY"
                app:layout_constraintTop_toBottomOf="@id/other_toolbar_xml"
                tools:ignore="NotSibling" />

            <TextView
                android:id="@+id/title_content_xml"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="16dp"
                android:layout_marginRight="16dp"
                android:paddingLeft="16dp"
                android:text="title"
                android:textColor="#1d1d1d"
                android:textDirection="rtl"
                android:textSize="17sp"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@id/img_content_xml" />

            <TextView
                android:id="@+id/content_content_xml"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="20dp"
                android:layout_marginEnd="16dp"
                android:layout_marginRight="16dp"
                android:paddingLeft="16dp"
                android:text="content"
                android:textColor="#1d1d1d"
                android:textDirection="rtl"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@id/title_content_xml" />

            <ImageView
                android:id="@+id/img_date_content_Xml"
                android:layout_width="18dp"
                android:layout_height="18dp"
                android:layout_marginTop="20dp"
                android:layout_marginEnd="16dp"
                android:layout_marginRight="16dp"
                android:layout_marginBottom="16dp"
                android:src="@drawable/date"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@id/content_content_xml" />

            <TextView
                android:id="@+id/date_content_xml"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="20dp"
                android:layout_marginEnd="8dp"
                android:layout_marginRight="8dp"
                android:layout_marginBottom="16dp"
                android:text="date"
                android:textColor="#1d1d1d"
                app:layout_constraintRight_toLeftOf="@id/img_date_content_Xml"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@id/content_content_xml" />

            <TextView
                android:id="@+id/subject_content_xml"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginStart="16dp"
                android:layout_marginLeft="16dp"
                android:layout_marginTop="20dp"
                android:singleLine="true"
                android:text="subject"
                android:textColor="#1d1d1d"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toBottomOf="@id/content_content_xml" />

        </androidx.constraintlayout.widget.ConstraintLayout>
    </ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

- Android Dev