【问题标题】:constraint layout has extra space at bottom约束布局在底部有额外的空间
【发布时间】:2018-05-03 03:30:50
【问题描述】:

我正在实现一个在滚动视图内使用约束布局的视图。我正在尝试使用app:layout_constraintBottom_toBottomOf="parent 将视图与父级底部对齐,但是正如您在图片中看到的那样,我的视图下方有额外的空白区域。蓝色视图下方的空白区域。有人可以指导我如何删除底部多余的空白。提前致谢。

这里是代码

<android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ScrollView
        android:id="@+id/scrollView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:requiresFadingEdge="vertical"
        android:fadingEdgeLength="90dp"
        android:fadingEdge="vertical"
        android:fillViewport="true"
        >

        <android.support.constraint.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            >

            <ImageView
                android:id="@+id/image"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:minHeight="275dp"
                android:scaleType="center"
                android:src="@drawable/bubble_exclaimation"
                app:layout_constraintBottom_toTopOf="@id/content_layout"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <android.support.constraint.ConstraintLayout
                android:id="@+id/content_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/image"
                android:background="@android:color/holo_blue_dark"
                android:paddingBottom="15dp"
                >

                <TextView
                    android:id="@+id/title"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:text="@string/title"
                    android:textSize="17sp"
                    app:layout_constraintBottom_toTopOf="@+id/body"
                    app:layout_constraintLeft_toLeftOf="@+id/left_guideline"
                    app:layout_constraintRight_toLeftOf="@+id/right_guideline"
                    app:layout_constraintTop_toBottomOf="parent" />

                <TextView
                    android:id="@+id/body"
                    android:layout_width="0dp"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="13dp"
                    android:text="@string/content_small"
                    android:textSize="12sp"
                    app:layout_constraintLeft_toLeftOf="@+id/left_guideline"
                    app:layout_constraintRight_toLeftOf="@+id/right_guideline"
                    app:layout_constraintTop_toBottomOf="@+id/title" />

                <android.support.constraint.Guideline
                    android:id="@+id/left_guideline"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    app:layout_constraintGuide_percent="0.11" />

                <android.support.constraint.Guideline
                    android:id="@+id/right_guideline"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    app:layout_constraintGuide_percent="0.89" />
            </android.support.constraint.ConstraintLayout>

        </android.support.constraint.ConstraintLayout>


    </ScrollView>

    <View
        android:id="@+id/block"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginTop="10dp"
        android:background="@android:color/holo_blue_dark"
        app:layout_constraintTop_toBottomOf="@id/scrollView"
        app:layout_constraintBottom_toBottomOf="parent"
        />

</android.support.constraint.ConstraintLayout>

【问题讨论】:

    标签: android android-layout android-constraintlayout


    【解决方案1】:

    android:id="@+id/content_layout" 中删除app:layout_constraintTop_toBottomOf="@+id/image"

     <?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"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
    
    
            <ScrollView
                android:id="@+id/scrollView"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:fadingEdge="vertical"
                android:fadingEdgeLength="90dp"
                android:fillViewport="true"
                android:requiresFadingEdge="vertical">
    
                <android.support.constraint.ConstraintLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">
    
                    <ImageView
                        android:id="@+id/image"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:minHeight="275dp"
                        android:scaleType="center"
                        android:src="@drawable/bubble_exclaimation"
                        app:layout_constraintBottom_toTopOf="@id/content_layout"
                        app:layout_constraintLeft_toLeftOf="parent"
                        app:layout_constraintRight_toRightOf="parent"
                        app:layout_constraintTop_toTopOf="parent" />
    
                    <android.support.constraint.ConstraintLayout
                        android:id="@+id/content_layout"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:background="@android:color/holo_blue_dark"
                        android:paddingBottom="15dp"
                        app:layout_constraintBottom_toBottomOf="parent">
    
                        <TextView
                            android:id="@+id/title"
                            android:layout_width="0dp"
                            android:layout_height="wrap_content"
                            android:text="@string/title"
                            android:textSize="17sp"
                            app:layout_constraintBottom_toTopOf="@+id/body"
                            app:layout_constraintLeft_toLeftOf="@+id/left_guideline"
                            app:layout_constraintRight_toLeftOf="@+id/right_guideline"
                            app:layout_constraintTop_toBottomOf="parent" />
    
                        <TextView
                            android:id="@+id/body"
                            android:layout_width="0dp"
                            android:layout_height="wrap_content"
                            android:layout_marginTop="13dp"
                            android:text="@string/content_small"
                            android:textSize="12sp"
                            app:layout_constraintLeft_toLeftOf="@+id/left_guideline"
                            app:layout_constraintRight_toLeftOf="@+id/right_guideline"
                            app:layout_constraintTop_toBottomOf="@+id/title" />
    
                        <android.support.constraint.Guideline
                            android:id="@+id/left_guideline"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:orientation="vertical"
                            app:layout_constraintGuide_percent="0.11" />
    
                        <android.support.constraint.Guideline
                            android:id="@+id/right_guideline"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:orientation="vertical"
                            app:layout_constraintGuide_percent="0.89" />
                    </android.support.constraint.ConstraintLayout>
    
                </android.support.constraint.ConstraintLayout>
    
    
            </ScrollView>
    
            <View
                android:id="@+id/block"
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_marginTop="10dp"
                android:background="@android:color/holo_blue_dark"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintTop_toBottomOf="@id/scrollView" />
    
    
        </android.support.constraint.ConstraintLayout>
    

    【讨论】:

    • 为什么当我们写layout_constraintBottom_toBottomOf="parentlayout_constraintTop_toTopOf="parent 时会发生这种情况? @MJM
    • 使用这两个属性,将内容对齐到中心,就像相对布局一样,align_botton 和 align_top 是视图是 wrap_content 它在屏幕中心对齐