ConstraintLayout을 ScrollView 안에 넣을 수 있습니까?

104

그래서 최근에 Android Studio 2.2에는 디자인을 훨씬 더 쉽게 만들어주는 새로운 ConstraintLayout이 있습니다.하지만 RelativeLayoutand 와는 달리 , 를 둘러싸 기 Linearlayout위해 사용할 수 없습니다 . 이게 가능해? 그렇다면 어떻게? ScrollViewConstraintLayot

즉 

<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>
android  android-layout  user-interface  android-constraintlayout 
— 세스 화가
소스
3
이 일을 방해하는 이유는 무엇입니까? 항상 XML에 직접 추가 할 수 있습니다 ...
— Karakuri 2016 년
코드와 어떤 오류가 발생하든 추가해야합니다.
— Alok
2
을 사용 layout_height="wrap_content"하면 앱에 빈 화면이 표시되지만을 사용 layout_height="match_parent"하면 앱이 스크롤되지 않습니다.
— Seth Painter
분명히 layout_height를 "wrap_content"로 설정하면 ConstraintLayout이 자식을 무시하고 축소됩니다. 이는 자식 요소가 ConstraintLayout의 상단 및 하단 (예 : 여백)에 대한 제한을 정의한 경우에도 마찬가지입니다.
— Jakub Mendyk
1
제약 레이아웃 스크롤을 만들기 위해 수행 할 수있는 작업이 있습니까? 아니면 돌아가서 다른 레이아웃을 사용해야합니까?
— 세스 페인터

답변:

85

ScrollViews 내부에 ConstraintLayout에 버그가 있었으며 수정되었습니다. Google은 Android Studio 2.2 Preview 2 (constraintlayout 1.0.0-alpha2)의 버그를 수정했습니다.

이 링크에서 새 업데이트 확인 (미리보기 2) : ScrollView 및 RecycleView 내에서 제대로 작동합니다 .

해결책 1 :

이 솔루션은 사용하는 것이 었습니다 android:fillViewport="true"온 ScrollView

해결책 2 :

with NestedScrollView대신 사용ScrollViewandroid:fillViewport="true"

— 고빈다 팔리 왈
소스
11
그들이 그것을 고치지 않은 것 같습니다. 프로덕션 버전에서는 여전히 작동하지 않습니다
— SimonH
3
확인할 수 있습니다. 2.3.3에서도 수정되지 않았습니다.
— Muhammad Babar
2
솔루션은 아래를 참조하십시오.
— eric.mcgregor
ScrollView에 android : fillViewport = "true"추가가 작동했습니다. Android 스튜디오 4.0.1
— Rupam Das
228

android:fillViewport="true"ScrollView에 추가해보십시오 .

여기에서 해결책을 찾았습니다. LinearLayout이 ScrollView 내부에서 확장되지 않습니다 .

— eric.mcgregor
소스
2
나를 위해 완벽하게이이 작품 감사 야아 @ eric.mcgregor
— Harin Kaklotar
4
당신은 내 생명을 구했습니다!
— 파라 즈 khonsari
1
Android Studio 3.0에서도 작동합니다!
— learn2code
나의 영웅을 간다
— 폴 알렉산더
2
내 하루를 구하십시오! 이것은 수락 된 답변으로 변경되어야합니다
— Pham
55

NestedScrollView뷰포트 true와 함께 사용 하면 나에게 잘 작동합니다.

<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>
— Rajesh Wolf
소스
당신은 제 하루를 구했습니다. 이것은 받아 들여진 대답이어야합니다.
— Євген Гарастович
11

다음으로 설정 ScrollView layout_height하면 wrap_content잘 작동합니다. 다음은 누군가를 도울 수있는 예입니다. compile 'com.android.support.constraint:constraint-layout:1.0.2'제약 레이아웃에 사용 했습니다.

<?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>
— Sakib Syed
소스
3
ConstraintLayout이 ScrollView 내부와 외부에있는 이유는 무엇입니까? ScrollView가 내부에 ConstraintLayout이있는 루트 요소 여야합니까?
— Diego Malone
5

일부 뷰의 하단을 제약 레이아웃의 하단으로 제한하면 스크롤 뷰가 스크롤 할 수 없다는 것을 잊지 마십시오.

— 아 메트 베파 53
소스
나는 어떤 값으로 마지막 뷰의 하단을 제한하지만, Constaintlayout는 마지막 항목 이상으로 스크롤 할 수 없습니다 : 사실 나는 어느 정도이 문제에 직면하고있다
— 클로드 Hangui
5

일부주는 시도 패딩 바닥을 아래처럼 제약 레이아웃

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/top"
        android:fillViewport="true">

        <android.support.constraint.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:paddingBottom="100dp">
        </android.support.constraint.ConstraintLayout>

    </ScrollView>
— 드래곤 파이어
소스
3

나는 ConstraintLayout소위 "안정된"릴리스 Android Studio 2.2에서 레이아웃을 변환하는 데 2 ​​일을 보냈고 ScrollView디자이너에서 일할 필요 가 없습니다 . Views스크롤 아래에있는 XML에 제약 조건을 추가하는 경로를 시작하지는 않겠습니다 . 결국 이것은 시각적 디자인 도구로 간주됩니다.

그리고 렌더링 오류, 스택 오버플로 및 테마 문제의 수로 인해 전체 ConstraintLayout구현이 여전히 버그로 가득 차 있다는 결론을 내 렸습니다 . 간단한 레이아웃을 개발하지 않는 한 최소한 몇 번 더 반복 할 때까지 그대로 두겠습니다.

2 일이면 돌아 오지 않을 거에요.

— SimonH
소스
1
점점 나아지고 있습니다. 현재 1.0.0-alpha9 및 File-> "Invalidate Caches / Restart"인 최신 버전을 사용하십시오.
— goetzc
1
감사. 이것은 개선입니다. 그리고 렌더링 오류의 수도 감소했습니다. 하지만 아직 모든 레이아웃을 변환 할 수있을만큼 안정적이라고 확신하지 못합니다. 나는 그들이 '알파'태그를 완전히 제거하고 적절한 프로덕션 버전을 출시 할 때까지 기다리기로 결정했습니다
— SimonH
3

실제 때문에 ScrollViewA의 캡슐화 CoordinatorLayout로모그래퍼 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>

... android:layout_marginTop="?attr/actionBarSize"스크롤링이 작동 하도록 정의 해야했습니다.

<?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>

위는 NestedScrollView대신 ScrollView. android:fillViewport="true"나에게는 정의 가 필요하지 않습니다.

— JJD
소스
-3

의 tools:context=".YouClassName"속성을 잊지 마세요 ScrollView.

내 응용 프로그램이 충돌하는 원인입니다.

— 드미트리
소스
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.