4

I'm my search the closest question was that: Scrollview inside constraint layout does not scroll to the bottom of the parent constraint

But there is no solution =|.

What I'm trying to do:

I have a constraint layout with 3 "parts": top bar, middle content and bottom button.

I want to put a scrollview only for the middle content. So if you scroll down and up you continuous to see the top bar and the bottom button

But this scroll view is not working, I think is something related with "match_parent" in the scrollview, but I can't put this option because as the scrollview is inside a Constraint Layout the size should be relative and if I put match parent it don't fill all spaces.

I'm using already: fillViewport="true", layout_constraintBottom_toBottomOf="parent"

Follow the code, scroll view name: "scrollview2"

<?xml version="1.0" encoding="utf-8"?>

<!--Create by Canato 26/09/2017-->

<com.flipboard.bottomsheet.BottomSheetLayout 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/needs_search_bottomsheet"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.constraint.ConstraintLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:layout_editor_absoluteY="25dp"
    tools:layout_editor_absoluteX="0dp">

    <android.support.constraint.Guideline
        android:id="@+id/horGuideline10"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.1"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="82dp" />

    <android.support.constraint.Guideline
        android:id="@+id/horGuideline90"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.9"
        tools:layout_editor_absoluteY="536dp"
        tools:layout_editor_absoluteX="0dp" />

    <include
        android:id="@+id/actionbar"
        layout="@layout/view_actionbar"
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toTopOf="@+id/horGuideline10"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:layout_constraintBottom_creator="1"
        tools:layout_constraintLeft_creator="1"
        tools:layout_constraintRight_creator="1"
        tools:layout_constraintTop_creator="1" />

    <Button
        android:id="@+id/needs_search_save_btn"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:background="@drawable/btn_green_bright_half_round_selector"
        android:gravity="center"
        android:text="@string/str_continue_save"
        android:textAllCaps="false"
        android:textColor="@color/WHITE"
        android:textSize="@dimen/size_text_button"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="@+id/horGuideline90"
        tools:layout_constraintBottom_creator="1"
        tools:layout_constraintLeft_creator="1"
        tools:layout_constraintRight_creator="1" />

    <ScrollView
        android:id="@+id/scrollView2"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:layout_marginBottom="0dp"
        android:layout_marginTop="0dp"
        android:fillViewport="true"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="@+id/horGuideline10">

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


            <android.support.constraint.Guideline
                android:id="@+id/verGuideline20"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                app:layout_constraintGuide_percent="0.2"
                tools:layout_editor_absoluteX="72dp"
                tools:layout_editor_absoluteY="206dp" />

            <android.support.constraint.Guideline
                android:id="@+id/verGuideline55"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                app:layout_constraintGuide_percent="0.55"
                tools:layout_editor_absoluteX="198dp"
                tools:layout_editor_absoluteY="206dp" />

            <android.support.constraint.Guideline
                android:id="@+id/verGuideline90"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                app:layout_constraintGuide_percent="0.9"
                tools:layout_editor_absoluteX="324dp"
                tools:layout_editor_absoluteY="206dp" />

            <android.support.constraint.Guideline
                android:id="@+id/horGuideline10in"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                app:layout_constraintGuide_percent="0.1"
                tools:layout_editor_absoluteX="0dp"
                tools:layout_editor_absoluteY="233dp" />

            <android.support.constraint.Guideline
                android:id="@+id/horGuideline20"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                app:layout_constraintGuide_percent="0.2"
                tools:layout_editor_absoluteX="0dp"
                tools:layout_editor_absoluteY="260dp" />

            <android.support.constraint.Guideline
                android:id="@+id/horGuideline28"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                app:layout_constraintGuide_percent="0.28"
                tools:layout_editor_absoluteX="0dp"
                tools:layout_editor_absoluteY="282dp" />

            <android.support.constraint.Guideline
                android:id="@+id/horGuideline38"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                app:layout_constraintGuide_percent="0.38"
                tools:layout_editor_absoluteX="0dp"
                tools:layout_editor_absoluteY="309dp" />

            <TextView
                android:id="@+id/needs_search_title_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="16dp"
                android:layout_marginStart="16dp"
                android:text="@string/service_request_title_text"
                android:textColor="@color/ANDROID_DARK_GRAY"
                android:textSize="@dimen/title_text_size"
                app:layout_constraintBaseline_toBaselineOf="@+id/needs_search_title_edit"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toLeftOf="@+id/verGuideline20" />

            <EditText
                android:id="@+id/needs_search_title_edit"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginEnd="8dp"
                android:layout_marginRight="8dp"
                android:layout_marginTop="8dp"
                android:ems="10"
                android:hint="@string/service_request_title_explanation_text"
                android:inputType="textPersonName"
                android:textColorHint="@color/ANDROID_DARK_GRAY"
                app:layout_constraintBottom_toTopOf="@+id/horGuideline10in"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintLeft_toLeftOf="@+id/verGuideline20"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintVertical_bias="0.0" />

            <ImageView
                android:id="@+id/iconLocation"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_marginBottom="8dp"
                android:layout_marginLeft="16dp"
                android:layout_marginStart="16dp"
                android:layout_marginTop="8dp"
                android:contentDescription="@string/service_request_location_icon_contentDescription"
                app:layout_constraintBottom_toTopOf="@+id/horGuideline20"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toLeftOf="@+id/verGuideline20"
                app:layout_constraintTop_toTopOf="@+id/horGuideline10in"
                app:layout_constraintVertical_bias="0.454"
                app:srcCompat="@drawable/ic_location_on_gray_24dp" />

            <EditText
                android:id="@+id/service_request_address_editText"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginEnd="16dp"
                android:layout_marginRight="16dp"
                android:layout_marginTop="8dp"
                android:ems="10"
                android:hint="@string/service_request_location_text"
                android:inputType="textPersonName"
                android:textColorHint="@color/ANDROID_DARK_GRAY"
                android:textSize="@dimen/size_text_button"
                app:layout_constraintLeft_toRightOf="@+id/iconLocation"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="@+id/horGuideline10in" />

            <ImageView
                android:id="@+id/iconDecribeText"
                android:layout_width="0dp"
                android:layout_height="0dp"

                android:layout_marginLeft="16dp"
                android:layout_marginStart="16dp"
                android:contentDescription="@string/service_request_text_contentDescription"
                app:layout_constraintBottom_toTopOf="@+id/horGuideline38"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toLeftOf="@+id/verGuideline20"
                app:layout_constraintTop_toTopOf="@+id/horGuideline28"
                app:srcCompat="@drawable/ic_short_text_gray_24dp" />

            <EditText
                android:id="@+id/needs_search_description_edit"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_marginEnd="16dp"
                android:layout_marginRight="16dp"
                android:layout_marginTop="8dp"
                android:ems="10"
                android:hint="@string/service_request_small_text_explanation"
                android:inputType="textMultiLine"
                android:textColorHint="@color/ANDROID_DARK_GRAY"
                android:textSize="@dimen/size_text_button"
                app:layout_constraintHorizontal_bias="0.0"
                app:layout_constraintLeft_toLeftOf="@+id/verGuideline20"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="@+id/horGuideline28" />

            <Button
                android:id="@+id/needs_search_address_locate_btn"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:alpha="0.5"
                android:background="@android:drawable/dialog_holo_light_frame"
                app:layout_constraintBottom_toTopOf="@+id/horGuideline28"
                app:layout_constraintLeft_toLeftOf="@+id/verGuideline20"
                app:layout_constraintRight_toLeftOf="@+id/verGuideline55"
                app:layout_constraintTop_toTopOf="@+id/horGuideline20"
                app:layout_constraintVertical_bias="0.0" />

            <Button
                android:id="@+id/needs_search_address_home_btn"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_marginEnd="8dp"
                android:layout_marginRight="8dp"
                android:alpha="0.5"
                android:background="@android:drawable/dialog_holo_light_frame"
                app:layout_constraintBottom_toTopOf="@+id/horGuideline28"
                app:layout_constraintLeft_toLeftOf="@+id/verGuideline55"
                app:layout_constraintRight_toLeftOf="@+id/verGuideline90"
                app:layout_constraintTop_toTopOf="@+id/horGuideline20"
                app:layout_constraintVertical_bias="0.0" />

            <android.support.v7.widget.RecyclerView
                android:id="@+id/needs_search_images_recyclerview"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_marginBottom="0dp"
                android:layout_marginEnd="16dp"
                android:layout_marginLeft="16dp"
                android:layout_marginRight="16dp"
                android:layout_marginStart="16dp"
                android:layout_marginTop="24dp"
                android:focusable="false"
                android:focusableInTouchMode="false"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/needs_search_description_edit"
                tools:listitem="@layout/needs_search_big_image_list_item" />

        </android.support.constraint.ConstraintLayout>
    </ScrollView>

</android.support.constraint.ConstraintLayout>

</com.flipboard.bottomsheet.BottomSheetLayout>
Rob
  • 2,243
  • 4
  • 29
  • 40
Canato
  • 3,598
  • 5
  • 33
  • 57

2 Answers2

2

Well, I just found the solution with a friend, first I think about delete this, but since other people maybe have the same problem here is the solution:

I just remove all guidelines and build again, connecting the elements without using so many guidelines.

Was a little bit of lucky, because I did this to fix when change the orientation.

Canato
  • 3,598
  • 5
  • 33
  • 57
  • With the availability of the `layout_constraintWidth_percent` and `layout_constraintHeight_percent` attributes to be used with the children of a ConstraintLayout, you can again get the same result as in your initial design that used Guidelines. The documentation of the `ConstraintLayout` has been updated to describe these new attributes. – ema3272 Dec 26 '17 at 11:58
1

You need to create a chain with the following constraints

  • in the top bar:

    app:layout_constraintBottom_toTopOf="@+id/scrollView2" app:layout_constraintTop_toTopOf="parent"

  • in the middle content:

    app:layout_constraintBottom_toTopOf="@+id/needs_search_save_btn" app:layout_constraintTop_toBottomOf="@+id/actionbar"

  • in the bottom button:

    app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintTop_toBottomOf="@+id/scrollView2"

ema3272
  • 1,021
  • 2
  • 13
  • 28
  • This will just remove the guidelines and connect the elements, right? How guarantee the percent use for each one without use static size? – Canato Sep 28 '17 at 16:01
  • Yes, in your question, you said you wanted to have the scrollview in the middle content, keeping the top bar and the bottom button always visible. The chain with the above constraints will do that. – ema3272 Sep 29 '17 at 10:59
  • But this was already working, the thing is that the scroll function was not working, but I solved removing the guidelines from the constraint layout inside. Thank you for the help =D – Canato Sep 29 '17 at 16:06