为什么最新版本的ConstraintLayout在带有CoordinatorLayout的nestedScrollView中不起作用

时间：2019-07-22 09:26:25

标签： android android-layout scrollview android-constraintlayout android-collapsingtoolbarlayout

我在滚动时使用带有collapsingToolbar的coordinatorlayout来实现视差效果

和collapsingToolbar中的内容视图（关于页面的文本）底部 nestedScrollView。

我的问题是nestedScrollView中的约束布局似乎不完整

如果我在nestedScrollView内容视图中使用LinearLayout，则一切都将显示。 但是我在nestedScrollView内容视图中使用ConstraintLayout似乎不完整，因为您可以看到以下代码

使用约束布局制作的内容视图

<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:id="@+id/mainLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:layout_anchor="@+id/appBarLayout"
        app:layout_anchorGravity="bottom">

    <androidx.coordinatorlayout.widget.CoordinatorLayout
            android:id="@+id/coordinatorLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.appbar.AppBarLayout
                android:id="@+id/appBarLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@android:color/transparent">

            <com.google.android.material.appbar.CollapsingToolbarLayout
                    android:id="@+id/collapsing_toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    app:collapsedTitleTextAppearance="@style/PrimaryTextField.NewsDetails.Expanded"
                    app:contentScrim="@color/transparentBlack"
                    app:expandedTitleGravity="bottom"
                    app:expandedTitleMarginBottom="@dimen/input_fields_margin"
                    app:expandedTitleMarginTop="@dimen/shrine_toolbar_offset_top"
                    app:expandedTitleTextAppearance="@style/PrimaryTextField.NewsDetails.Expanded"
                    app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
                    app:titleEnabled="false">

                <androidx.appcompat.widget.AppCompatImageView
                        android:id="@+id/newsPhoto"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:adjustViewBounds="true"
                        android:scaleType="fitXY"
                        app:layout_collapseMode="parallax"
                        app:layout_collapseParallaxMultiplier="0.7" />

                <androidx.appcompat.widget.Toolbar
                        android:id="@+id/news_detail_toolbar"
                        android:layout_width="match_parent"
                        android:layout_height="?attr/actionBarSize"
                        android:background="@android:color/transparent"
                        android:theme="@style/ToolBarStyle.NewsDetails"
                        app:layout_collapseMode="pin"
                        app:layout_scrollFlags="scroll|enterAlwaysCollapsed"
                        app:popupTheme="@style/AppTheme.PopupOverlay"
                        app:title=""
                        app:titleTextColor="@android:color/white" />
            </com.google.android.material.appbar.CollapsingToolbarLayout>
        </com.google.android.material.appbar.AppBarLayout>

        <androidx.core.widget.NestedScrollView
                android:id="@+id/scrollView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="8dp"
                android:fitsSystemWindows="true"
                android:orientation="vertical"
                android:scrollbarSize="5dp"
                android:scrollbars="vertical"
                app:layout_behavior="@string/appbar_scrolling_view_behavior">

            <androidx.constraintlayout.widget.ConstraintLayout
                    android:id="@+id/contentLayout"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:minHeight="400dp"
                    android:orientation="vertical">

                <androidx.appcompat.widget.AppCompatTextView
                        android:id="@+id/newsTitle"
                        style="@style/PrimaryTextFieldBold"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_margin="@dimen/small_margin"
                        android:maxLines="3"
                        android:textSize="@dimen/primary_text_large"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toTopOf="parent"
                        />

                <androidx.appcompat.widget.AppCompatTextView
                        android:id="@+id/newsDate"
                        style="@style/PrimaryTextFieldBold"
                        android:layout_width="wrap_content"
                        android:layout_margin="@dimen/small_margin"
                        android:textSize="@dimen/primary_text_medium"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toBottomOf="@id/newsTitle"
                        tools:text="08.08.2008 18:00" />

                <androidx.appcompat.widget.AppCompatTextView
                        android:id="@+id/photoOwner"
                        style="@style/PrimaryTextFieldBold"
                        android:layout_margin="@dimen/small_margin"
                        android:layout_weight="1"
                        android:textSize="@dimen/primary_text_medium"
                        app:layout_constraintBottom_toBottomOf="@id/newsDate"
                        app:layout_constraintStart_toEndOf="@id/newsDate"
                        app:layout_constraintTop_toTopOf="@id/newsDate"
                        tools:text="Daily News" />


                <androidx.appcompat.widget.AppCompatImageView
                        android:id="@+id/showComments"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="end"
                        android:padding="@dimen/small_margin"
                        android:src="@drawable/ic_comment"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintTop_toBottomOf="@id/newsTitle" />


                <androidx.appcompat.widget.AppCompatTextView
                        android:id="@+id/newsText"
                        style="@style/PrimaryTextField"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_margin="@dimen/small_margin"
                        android:paddingBottom="32dp"
                        android:textSize="@dimen/primary_text_medium"
                        app:layout_constraintEnd_toEndOf="parent"
                        app:layout_constraintStart_toStartOf="parent"
                        app:layout_constraintTop_toBottomOf="@id/newsDate"
                />


            </androidx.constraintlayout.widget.ConstraintLayout>
        </androidx.core.widget.NestedScrollView>
    </androidx.coordinatorlayout.widget.CoordinatorLayout>

</androidx.constraintlayout.widget.ConstraintLayout>
  

如果我已经使用Linearlayout，那就可以了。

<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:id="@+id/mainLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:layout_anchor="@+id/appBarLayout"
            app:layout_anchorGravity="bottom">

        <androidx.coordinatorlayout.widget.CoordinatorLayout
                android:id="@+id/coordinatorLayout"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent">

            <com.google.android.material.appbar.AppBarLayout
                    android:id="@+id/appBarLayout"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@android:color/transparent">

                <com.google.android.material.appbar.CollapsingToolbarLayout
                        android:id="@+id/collapsing_toolbar"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        app:collapsedTitleTextAppearance="@style/PrimaryTextField.NewsDetails.Expanded"
                        app:contentScrim="@color/transparentBlack"
                        app:expandedTitleGravity="bottom"
                        app:expandedTitleMarginBottom="@dimen/input_fields_margin"
                        app:expandedTitleMarginTop="@dimen/shrine_toolbar_offset_top"
                        app:expandedTitleTextAppearance="@style/PrimaryTextField.NewsDetails.Expanded"
                        app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
                        app:titleEnabled="false">

                    <androidx.appcompat.widget.AppCompatImageView
                            android:id="@+id/newsPhoto"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:adjustViewBounds="true"
                            android:scaleType="fitXY"
                            app:layout_collapseMode="parallax"
                            app:layout_collapseParallaxMultiplier="0.7" />

                    <androidx.appcompat.widget.Toolbar
                            android:id="@+id/news_detail_toolbar"
                            android:layout_width="match_parent"
                            android:layout_height="?attr/actionBarSize"
                            android:background="@android:color/transparent"
                            android:theme="@style/ToolBarStyle.NewsDetails"
                            app:layout_collapseMode="pin"
                            app:layout_scrollFlags="scroll|enterAlwaysCollapsed"
                            app:popupTheme="@style/AppTheme.PopupOverlay"
                            app:title=""
                            app:titleTextColor="@android:color/white" />
                </com.google.android.material.appbar.CollapsingToolbarLayout>
            </com.google.android.material.appbar.AppBarLayout>

            <androidx.core.widget.NestedScrollView
                    android:id="@+id/scrollView"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="8dp"
                    android:fitsSystemWindows="true"
                    android:orientation="vertical"
                    android:scrollbarSize="5dp"
                    android:scrollbars="vertical"
                    app:layout_behavior="@string/appbar_scrolling_view_behavior">

                <LinearLayout
                        android:id="@+id/contentLayout"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:minHeight="400dp"
                        android:orientation="vertical">

                    <androidx.appcompat.widget.AppCompatTextView
                            android:id="@+id/newsTitle"
                            style="@style/PrimaryTextFieldBold"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:layout_margin="@dimen/small_margin"
                            android:maxLines="3"
                            android:textSize="@dimen/primary_text_large"
                            app:layout_constraintEnd_toEndOf="parent"
                            app:layout_constraintStart_toStartOf="parent"
                            app:layout_constraintTop_toTopOf="parent" />

                    <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:orientation="horizontal">

                        <androidx.appcompat.widget.AppCompatTextView
                                android:id="@+id/newsDate"
                                style="@style/PrimaryTextFieldBold"
                                android:layout_width="wrap_content"
                                android:layout_margin="@dimen/small_margin"
                                android:textSize="@dimen/primary_text_medium"
                                tools:text="08.08.2008 18:00" />

                        <androidx.appcompat.widget.AppCompatTextView
                                android:id="@+id/photoOwner"
                                style="@style/PrimaryTextFieldBold"
                                android:layout_margin="@dimen/small_margin"
                                android:layout_weight="1"
                                android:textSize="@dimen/primary_text_medium"
                                tools:text="Daily News" />


                        <androidx.appcompat.widget.AppCompatImageView
                                android:id="@+id/showComments"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="end"
                                android:padding="@dimen/small_margin"
                                android:src="@drawable/ic_comment" />

                    </LinearLayout>


                    <androidx.appcompat.widget.AppCompatTextView
                            android:id="@+id/newsText"
                            style="@style/PrimaryTextField"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:layout_margin="@dimen/small_margin"
                            android:paddingBottom="32dp"
                            android:textSize="@dimen/primary_text_medium"
                            app:layout_constraintEnd_toEndOf="parent"
                            app:layout_constraintStart_toStartOf="parent"
                            app:layout_constraintTop_toBottomOf="@id/newsDate"/>

                </LinearLayout>
            </androidx.core.widget.NestedScrollView>
        </androidx.coordinatorlayout.widget.CoordinatorLayout>

    </androidx.constraintlayout.widget.ConstraintLayout>

约束布局版本“ 2.0.0-beta2”

2 个答案:

答案 0 :(得分：0)

添加此

implementation 'com.android.support.constraint:constraint-layout:1.1.3'

答案 1 :(得分：0)

如果您使用约束“ 2.0.0-beta 2”，那么我建议您在示例中尝试“运动布局”。 Motion Layout是从Constraint Layout扩展的布局类。运动版式具有约束版式的所有功能。

您可以参考此链接以了解运动布局 https://blog.stylingandroid.com/motionlayout-collapsing-toolbar-part-1/

相关问题
最新问题