Home » Android » ScrollView and ConstraintLayout not working

ScrollView and ConstraintLayout not working

Posted by: admin November 1, 2017 Leave a comment

Questions:

I have added the <ScrollView> code on activity.xml

There is my xml code:

        <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fillViewport="true"
            android:scrollbarStyle="insideOverlay">
    <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:id="@+id/scrooll"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

<android.support.design.widget.TextInputLayout
        android:id="@+id/textInputLayout5"
        android:layout_width="0dp"
        android:layout_height="59dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:focusable="false"
        android:visibility="invisible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/button4"
        app:layout_constraintTop_toBottomOf="@+id/textInputLayout3"
        app:layout_constraintVertical_bias="0.0">

        <EditText
            android:id="@+id/numero"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:editable="false"
            android:focusable="false"
            android:hint="Numero"
            android:inputType="none"
            tools:layout_editor_absoluteX="8dp"
            tools:layout_editor_absoluteY="-195dp" />
    </android.support.design.widget.TextInputLayout>


    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyle"
        android:layout_width="119dp"
        android:layout_height="101dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="16dp"
        android:indeterminate="true"
        android:visibility="visible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.491"
        tools:visibility="visible" />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:text="Destinatario:"
        android:textSize="18sp"
        android:visibility="invisible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.501"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textInputLayout"
        app:layout_constraintVertical_bias="0.0" />          

    <Spinner
        android:id="@+id/spinner"
        android:layout_width="0dp"
        android:layout_height="45dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:entries="@array/country_arrays"
        android:spinnerMode="dialog"
        android:visibility="invisible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textInputLayout5"
        app:layout_constraintVertical_bias="0.013" />

    <Button
        android:id="@+id/button2"
        android:layout_width="0dp"
        android:layout_height="65dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:onClick="Aggiorna"
        android:text="Aggiorna"
        android:visibility="invisible"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHorizontal_bias="0.0"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/spinner"
        app:layout_constraintVertical_bias="0.0" />

but after this operation the layout is not centered on phone:

enter image description here

and before scrollview:

enter image description here

Any element is anchored perfectly =(

this is my first application, please be patient =)this is my first application, please be patient =)this is my first application, please be patient =)

Answers:

I think that’s working as intended. Here’s what you have:

<scrollview>
  <constraintlayout>
    ... other widgets ...
    <spinner>
    ... other widgets ...
  </constraintlayout>
</scrollview>

With the spinner constrained to the parent (the constraintlayout).

So… if you put the constraintlayout in a scrollview, obviously it can be taller than the screen — that’s the point of scrollview, to handle this scenario. The spinner is not constrained to the screen, it’s constrained to the parent. So if the parent happens to be taller than the screen, well, the spinner will be centered in the parent, that’s all.

What you seem to want is a little different:

<constraintlayout>
    <scrollview>
        <constraintlayout>
            ... other widgets ...
        </constraintlayout>
    </scrollview>
    <spinner>
</constraintlayout>

With scrollview being set to whatever size you want, and the spinner being declared after it (to be drawn afterward). The spinner can then be set as in your code, centered inside the parent, but this time the parent will be corresponding to the visible screen. Then, inside the scrollview, you put another constraintlayout containing your content.

Questions:
Answers:

i think it’s better for you to use a “Guide Line” to make your activity or project responsive.

Thanks 🙂

Questions:
Answers:

The scrollview’s child is linear layout not constraint layout. Use linear layout(with orientation) instead of constraint layout

I edited your code little bit 🙂

<ScrollView android:layout_height="match_parent"
android:layout_width="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">


<LinearLayout android:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/scrooll"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.design.widget.TextInputLayout
        android:id="@+id/textInputLayout5"
        android:layout_width="0dp"
        android:layout_height="59dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:focusable="false"
        android:visibility="invisible"
        >

        <EditText
            android:id="@+id/numero"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:focusable="false"
            android:hint="Numero"
            android:inputType="none" />
    </android.support.design.widget.TextInputLayout>


    <ProgressBar
        android:id="@+id/progressBar"
        style="?android:attr/progressBarStyle"
        android:layout_width="match_parent"
        android:layout_height="101dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="16dp"
        android:indeterminate="true"
        android:visibility="visible"
        />

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:text="Destinatario:"
        android:textSize="18sp"
        android:visibility="invisible" />

    <Spinner
        android:id="@+id/spinner"
        android:layout_width="0dp"
        android:layout_height="45dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:entries="@array/country_arrays"
        android:spinnerMode="dialog"
        android:visibility="invisible"
       />

    <Button
        android:id="@+id/button2"
        android:layout_width="0dp"
        android:layout_height="65dp"
        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:onClick="Aggiorna"
        android:text="Aggiorna"
        android:visibility="invisible"
        />

</LinearLayout></ScrollView>

and also scroll view is unnecessary too