it-swarm-pt.tech

É possível colocar um ConstraintLayout dentro de um ScrollView?

Recentemente, com o Android Studio 2.2, há um novo ConstraintLayout que facilita muito o design, mas, ao contrário de RelativeLayout e Linearlayout, não posso usar uma ScrollView para cercar ConstraintLayot. Isso é possível? Se sim, como? 

isto é 

<ScrollView 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"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="0dp">

        <Android.support.constraint.ConstraintLayout
            Android:id="@+id/constraintLayout"
            Android:layout_width="match_parent"
            Android:layout_height="match_parent"
            tools:layout_editor_absoluteX="0dp"
            tools:layout_editor_absoluteY="0dp">

            <!-- Have whatever children you want inside -->

        </Android.support.constraint.ConstraintLayout>

</ScrollView>
58
Seth Painter

Houve um bug com o ConstraintLayout dentro do ScrollViews e foi corrigido. O Google corrigiu o bug no Android Studio 2.2 Preview 2 (constraintlayout 1.0.0-alpha2). 

Verifique este link para uma nova atualização (Preview 2): funciona corretamente dentro do ScrollView e do RecycleView

29
Govinda Paliwal

Tente adicionar Android:fillViewport="true" ao ScrollView.

Encontrou a solução aqui: LinearLayout não se expande dentro de um ScrollView

143
eric.mcgregor

use NestedScrollView com viewport true está funcionando bem para mim 

<Android.support.v4.widget.NestedScrollView
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:fillViewport="true">

        <Android.support.constraint.ConstraintLayout
            Android:layout_width="match_parent"
            Android:layout_height="700dp">

        </Android.support.constraint.ConstraintLayout>

</Android.support.v4.widget.NestedScrollView>
23
rajesh vinew

Defina ScrollViewlayout_height como wrap_content e funcionará bem. Abaixo estão exemplos que podem ajudar alguém. Eu usei compile 'com.Android.support.constraint:constraint-layout:1.0.2' para layout de restrição.

<?xml version="1.0" encoding="utf-8"?>
<Android.support.constraint.ConstraintLayout
    Android:orientation="vertical"
    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"
    Android:id="@+id/activity_main"
    tools:context=".ScrollViewActivity">

    <ScrollView
        Android:layout_width="0dp"
        Android:layout_height="wrap_content"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        >

        <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:layout_width="match_parent"
            Android:layout_height="wrap_content"
            Android:orientation="vertical"
            Android:paddingLeft="8dp"
            Android:paddingRight="8dp"
            Android:scrollbars="vertical">

            <TextView
                Android:id="@+id/tvCommonSurname"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:text="surname"
                Android:textAppearance="?android:attr/textAppearanceLarge"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintTop_creator="1" />

            <EditText
                Android:id="@+id/editText3"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:ems="10"
                Android:inputType="text"
                Android:maxLines="1"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/tvCommonSurname"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintRight_creator="1"
                tools:layout_constraintTop_creator="1" />

            <TextView
                Android:id="@+id/tvCommonName"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:text="firstName"
                Android:textAppearance="?android:attr/textAppearanceLarge"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/editText3"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintTop_creator="1" />

            <EditText
                Android:id="@+id/editText"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:ems="10"
                Android:inputType="text"
                Android:maxLines="1"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/tvCommonName"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintRight_creator="1"
                tools:layout_constraintTop_creator="1" />

            <TextView
                Android:id="@+id/tvCommonLastName"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:text="middleName"
                Android:textAppearance="?android:attr/textAppearanceLarge"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/editText"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintTop_creator="1" />

            <EditText
                Android:id="@+id/editText2"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:ems="10"
                Android:inputType="text"
                Android:maxLines="1"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/tvCommonLastName"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintRight_creator="1"
                tools:layout_constraintTop_creator="1" />

            <TextView
                Android:id="@+id/tvCommonPhone"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:text="Phone number"
                Android:textAppearance="?android:attr/textAppearanceLarge"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/editText2"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintTop_creator="1" />

            <EditText
                Android:id="@+id/editText4"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:digits="0123456789"
                Android:ems="10"
                Android:inputType="phone"
                Android:maxLength="10"
                Android:maxLines="1"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/tvCommonPhone"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintRight_creator="1"
                tools:layout_constraintTop_creator="1" />

            <TextView
                Android:id="@+id/textView3"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:text="sex"
                Android:textAppearance="?android:attr/textAppearanceLarge"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/editText4"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintTop_creator="1" />

            <RadioGroup 
                xmlns:Android="http://schemas.Android.com/apk/res/Android"
                Android:id="@+id/radiogroup"
                Android:layout_width="0dp"
                Android:layout_height="48dp"
                Android:layout_marginTop="8dp"
                Android:orientation="horizontal"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/textView3"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintTop_creator="1">

                <RadioButton
                    Android:layout_width="wrap_content"
                    Android:layout_height="wrap_content"
                    Android:text="pirates" />

                <RadioButton
                    Android:layout_width="wrap_content"
                    Android:layout_height="wrap_content"
                    Android:text="ninjas" />
            </RadioGroup>

            <TextView
                Android:id="@+id/tvCommonDOB"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:text="dob"
                Android:textAppearance="?android:attr/textAppearanceLarge"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/radiogroup"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintTop_creator="1" />

            <EditText
                Android:id="@+id/editText5"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:ems="10"
                Android:inputType="date"
                Android:maxLines="1"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/tvCommonDOB"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintRight_creator="1"
                tools:layout_constraintTop_creator="1" />

            <TextView
                Android:id="@+id/tvCommonLivingCity"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:text="livingCity"
                Android:textAppearance="?android:attr/textAppearanceLarge"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/editText5"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintTop_creator="1" />

            <EditText
                Android:id="@+id/editText34"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:ems="10"
                Android:inputType="text"
                Android:maxLines="1"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/tvCommonLivingCity"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintRight_creator="1"
                tools:layout_constraintTop_creator="1" />

            <TextView
                Android:id="@+id/tvCommonPlaceOfBithday"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:text="placeOfBirth"
                Android:textAppearance="?android:attr/textAppearanceLarge"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/editText34"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintTop_creator="1" />

            <EditText
                Android:id="@+id/editText6"
                Android:layout_width="0dp"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:ems="10"
                Android:inputType="text"
                Android:maxLines="1"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/tvCommonPlaceOfBithday"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintRight_creator="1"
                tools:layout_constraintTop_creator="1" />

            <TextView
                Android:id="@+id/textView4"
                Android:layout_width="wrap_content"
                Android:layout_height="wrap_content"
                Android:layout_marginTop="8dp"
                Android:text="education"
                Android:textAppearance="?android:attr/textAppearanceLarge"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/editText6"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintTop_creator="1" />

            <Spinner
                Android:id="@+id/spinner_id"
                Android:layout_width="0dp"
                Android:layout_height="48dp"
                Android:layout_marginTop="8dp"
                Android:spinnerMode="dialog"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toBottomOf="@+id/textView4"
                tools:layout_constraintLeft_creator="1"
                tools:layout_constraintRight_creator="1"
                tools:layout_constraintTop_creator="1" />

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


</Android.support.constraint.ConstraintLayout>
7
Sakib Syed

Eu relatei o bug para a equipe do Google.

Você pode ver isto aqui .

5
amorenew

Passei 2 dias tentando converter layouts para ConstraintLayout na chamada versão "estável" do Android Studio 2.2 e não tenho ScrollView para trabalhar no designer. Eu não vou começar a rota de adicionar restrições em XML para Views que estão mais abaixo no pergaminho. Depois de tudo isso, é suposto ser uma ferramenta de design visual. 

E o número de erros de renderização, estouro de pilha e problemas de tema que tive me levou a concluir que toda a implementação ConstraintLayout ainda está repleta de bugs. A menos que você esteja desenvolvendo layouts simples, eu ficaria bem sozinho até que tenha mais algumas iterações, pelo menos.

São 2 dias que não vou voltar. 

3
SimonH

Não se esqueça disso Se você restringir o fundo de algumas das vistas para restringir a parte inferior do layout. A rolagem não pode rolar.

1
ahmetvefa53

Novo estúdio Android após o 2.2 ConstraintLayout agora funciona corretamente dentro do ScrollView.

Assim abaixo, exemplo:

<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:layout_width="match_parent"
    Android:layout_height="match_parent">
<ScrollView
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content">

        <Android.support.constraint.ConstraintLayout
            Android:layout_width="match_parent"
            Android:layout_height="wrap_content">
</Android.support.constraint.ConstraintLayout>
    </ScrollView>
</Android.support.constraint.ConstraintLayout>

Espero que te ajude ..!

0
Viral Patel

Como o ScrollView real é encapsulado em um CoordinatorLayout com um Toolbar ...

<?xml version="1.0" encoding="utf-8"?>
<Android.support.design.widget.CoordinatorLayout
    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">

    <Android.support.design.widget.AppBarLayout
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:theme="@style/AppTheme.AppBarOverlay">

        <Android.support.v7.widget.Toolbar
            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="?attr/actionBarSize"
            Android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay"/>

    </Android.support.design.widget.AppBarLayout>

    <include layout="@layout/list"/>

</Android.support.design.widget.CoordinatorLayout>

... eu tive que definir Android:layout_marginTop="?attr/actionBarSize" para fazer a rolagem funcionar:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
    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="wrap_content"
    Android:layout_marginTop="?attr/actionBarSize">

    <Android.support.constraint.ConstraintLayout
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <!-- UI elements here -->

    </Android.support.constraint.ConstraintLayout>

</ScrollView>

Acima também funciona com NestedScrollView em vez de ScrollView. Definir Android:fillViewport="true" não é necessário para mim.

0
JJD

Eu tive um erro que ConstraintLayout não é permitido, então eu adicionei o Android.support.constraint.ConstraintLayout e está funcionando. Sou iniciante e não entendo o porquê.

0
Cristi Băluță

Não se esqueça da propriedade tools:context=".YouClassName" em ScrollView.

É o que estava causando meu aplicativo para falhar.

0
Dmitry