Android - 스크롤 가능한 제약 조건 레이아웃을 만드는 방법은 무엇입니까?

Android - 스크롤 가능한 제약 조건 레이아웃을 만드는 방법은 무엇입니까?

제약 조건 레이아웃을 사용하여 아래로 스크롤할 수 있는 레이아웃을 만들고 싶은데 어떻게 해야 할지 모르겠습니다.만약에ScrollView의모되의 ConstraintLayout 렇게요?

<?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="match_parent"
    android:fillViewport="true">

<android.support.constraint.ConstraintLayout
    android:id="@+id/Constraint"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

아니면 반대로?누군가 나에게 이것에 대한 좋은 튜토리얼을 알려줄 수도 있고, 예를 들어줄 수도 있지만, 나는 그것을 찾을 수 없는 것 같습니다.

또한 설정하지 않은 버그인지 구성인지는 모르겠지만 다음과 같은 이미지를 보았습니다.

Blueprint "파란색 사각형" 외부에 일부 구성 요소가 있지만 이러한 구성 요소는 볼 수 있지만 "흰색 공간"에 구성 요소를 배치하면 해당 구성 요소를 보거나 이동할 수 없습니다. 구성 요소 트리에 표시됩니다.

업데이트:

설계 도구에서 수평 가이드라인을 사용하여 제약 조건 레이아웃 경계를 아래로 누르고 장치 너머로 확장하여 제약 조건 레이아웃을 스크롤할 수 있도록 하는 방법을 찾았습니다. 그런 다음 가이드라인을 제약 조건 레이아웃의 새 하단으로 사용하여 구성 요소를 고정할 수 있습니다.

작동하는 것 같습니다. 어떤 종속성으로 작업했는지는 모르겠지만 이번에는

compile 'com.android.support.constraint:constraint-layout:1.0.2'

효과가 있어요, 이게 제가 한 일입니다.

<?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="match_parent"
    tools:context=".MainActivity">

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

        <android.support.design.widget.TextInputLayout
            android:id="@+id/til_input"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:hint="Escriba el contenido del archivo"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toLeftOf="@+id/btn_save"
            app:layout_constraintTop_toTopOf="@id/btn_save"
            app:layout_constraintVertical_chainStyle="spread">

            <EditText
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </android.support.design.widget.TextInputLayout>

        <Button
            android:id="@+id/btn_save"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="onClickButtonSave"
            android:text="Guardar"
            app:layout_constraintLeft_toRightOf="@+id/til_input"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <TextView
            android:id="@+id/txt_content"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginTop="0dp"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toBottomOf="@id/til_input"
            app:layout_constraintVertical_chainStyle="spread"
            app:layout_constraintVertical_weight="1" />

        <Button
            android:id="@+id/btn_delete"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:onClick="onClickButtonDelete"
            android:text="Eliminar"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toBottomOf="@id/txt_content"
            app:layout_constraintVertical_chainStyle="spread" />

    </android.support.constraint.ConstraintLayout>

</ScrollView>

맨 위로 스크롤

맨 아래로 스크롤

스크롤 기능을 중단시키는 제약 조건 유형이 있습니다.

원하는 경우 보기에 이 제약 조건을 사용하지 않아야 합니다.ConstraintLayout스롤할수있으로 수 ScrollView:

app:layout_constraintBottom_toBottomOf=“parent”

이러한 항목을 제거하면 스크롤이 작동합니다.

설명:

를 어린이의 키와 ScrollView부모는 구성 요소가 의도한 것과 모순됩니다.동적 크기의 보다 클 때 합니다. 즉,와 일치하는 입니다.ScrollView모든 콘텐츠가 고정 프레임(부모의 높이)으로 강제 표시되므로 스크롤 기능이 비활성화됩니다.

자녀 가 " 문는일직접자식구성요소다가음같이다발생경니합우설도에정된과이제반인적다▁to"로 설정되어 있을 때 발생합니다.layout_height="match_parent".

만약 당신이 그 아이를 원한다면.ScrollView콘텐츠가 충분하지 않을 때 상위 항목의 높이를 일치시키려면 단순히 설정합니다.android:fillViewport에 ScrollView.

viewport true와 함께 NestedScrollView 사용하는 것이 좋습니다.

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

안드로이드용 x 이것을 사용하세요.

 <androidx.core.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true">
    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
.....other views....

</androidx.constraintlayout.widget.ConstraintLayout>
    </androidx.core.widget.NestedScrollView>

요약하자면, 당신은 기본적으로 당신의 것을 포장합니다.android.support.constraint.ConstraintLayout에서 ScrollView의본안에의 본문 에.*.xml레이아웃과 연결된 파일입니다.

예 activity_sign_in.xml

<?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="match_parent"
    tools:context=".SignInActivity"> <!-- usually the name of the Java file associated with this activity -->

    <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"
        android:background="@drawable/gradient"
        tools:context="app.android.SignInActivity">

        <!-- all the layout details of your page -->

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

---

참고 1: 스크롤 막대는 키보드 팝업을 포함하여 랩이 필요한 경우에만 나타납니다.

참고 2: 특히 배경이 있는 경우에는 제약 조건 레이아웃이 화면 하단과 측면에 닿을 정도로 충분히 커지도록 하는 것도 나쁘지 않을 것입니다. 이렇게 하면 공백이 생기지 않습니다.공백을 사용하여 이 작업을 수행할 수 있습니다.

구레사용만웃이 안에 있는 제약 을 사용하면 .NestedScrollView또는ScrollView.

<android.support.v4.widget.NestedScrollView
        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.support.constraint.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/white">

 </android.support.constraint.ConstraintLayout>

</android.support.v4.widget.NestedScrollView>

그게 다야.코딩을 즐기십시오.

여기에 많은 답이 있습니다. 간단한 것은 없습니다.ScrollView는 layout_height으로 설정됨match_parent天皇가 동안에이사.layout_height은 제약조 웃의경우입니다.wrap_content

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

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    
    ...

아래 솔루션을 사용하여 수정하는 데 많은 시간이 걸렸습니다.

즐거운 시간 보내세요 :)

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    android:background="@color/white"
    >

    <ScrollView
        android:id="@+id/mainScroll"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/white"
        android:fillViewport="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentStart="true">
        <RelativeLayout
            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:layout_gravity="bottom"
                android:layout_alignParentStart="true"
                android:layout_alignParentTop="true"
                android:layout_alignParentBottom="true"
                android:layout_alignParentEnd="true"
                >

            </android.support.constraint.ConstraintLayout>

        </RelativeLayout>
    </ScrollView>
</RelativeLayout>

이렇게 사용하면 반드시 해결책을 찾을 수 있습니다.

스크롤 가능한 레이아웃을 만들려면 레이아웃이 올바릅니다.다른 레이아웃과 마찬가지로 스크롤해야 하는 이유가 있을 때까지 스크롤할 수 없습니다.따라서 컨텐츠를 충분히 추가하면 레이아웃(선형, 상대형 등)과 마찬가지로 스크롤이 가능합니다.그러나 제약 조건 레이아웃 및 ScrollView를 사용하여 설계하는 경우 Blueprint 또는 설계 모드에서 제대로 스크롤할 수 없습니다.

의미:

스크롤 가능한 제약 조건 레이아웃을 만들 수 있지만 고려되지 않은 버그/시나리오로 인해 편집기에서 제대로 스크롤되지 않습니다.하지만 편집기에서는 스크롤이 작동하지 않지만, 기기에서는 작동합니다.(스크롤링 CONSTRINT Layout을 여러 번 만들어서 테스트해 봤습니다.)

메모

당신의 코드에 관해서요.ScrollView에 닫는 태그가 없습니다. 파일에 있는 경우인지, 복사 붙여넣기 오류인지는 알 수 없지만 확인해 보시기 바랍니다.

이전 답변을 완료하기 위해 AppBar 사용을 고려하여 다음 예제를 추가합니다.이 코드를 사용하면 Android Studio 설계 편집기가 제약 조건 레이아웃과 잘 작동하는 것 같습니다.

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout
    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:fitsSystemWindows="true"
    android:background="@drawable/bg"
    android:orientation="vertical">

<android.support.design.widget.AppBarLayout
    android:id="@+id/app_bar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.ActionBar.AppOverlayTheme">
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        app:popupTheme="@style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>

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

        <ImageView
            android:id="@+id/image_id"
            android:layout_width="match_parent"
            android:layout_height="@dimen/app_bar_height"
            android:fitsSystemWindows="true"
            android:scaleType="centerCrop"
            android:src="@drawable/intro"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="parent" />

        <TextView
            android:id="@+id/desc_id"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="@dimen/text_margin"
            android:text="@string/intro_desc"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/image_id" />

        <Button
            android:id="@+id/button_scan"
            style="?android:textAppearanceSmall"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:backgroundTint="@color/colorAccent"
            android:padding="8dp"
            android:text="@string/intro_button_scan"
            android:textStyle="bold"
            app:layout_constraintTop_toBottomOf="@+id/desc_id" />

        <Button
            android:id="@+id/button_return"
            style="?android:textAppearanceSmall"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="8dp"
            android:layout_marginTop="8dp"
            android:backgroundTint="@color/colorAccent"
            android:padding="8dp"
            android:text="@string/intro_button_return"
            android:textStyle="bold"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/button_recycle" />

        <Button
            android:id="@+id/button_recycle"
            style="?android:textAppearanceSmall"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="8dp"
            android:backgroundTint="@color/colorAccent"
            android:padding="8dp"
            android:text="@string/intro_button_recycle"
            android:textStyle="bold"
            app:layout_constraintTop_toBottomOf="@+id/button_scan" />
    </android.support.constraint.ConstraintLayout>
</ScrollView>
</LinearLayout>

ScrollView 태그로 내 제약 조건을 둘러싸야 하고 Android:isScrollContainer="true" 속성을 지정해야 합니다.

중첩된 스크롤 뷰에서 아래쪽 버튼을 꺼내 선형 레이아웃을 상위로 가져옵니다.하단 및 중첩 스크롤 뷰를 자식으로 추가합니다.그것은 아주 잘 될 것입니다.활동을 위한 매니페스트에서 이 기능을 사용합니다. 키보드를 열면 버튼이 올라갑니다.

android:windowSoftInputMode="adjustResize|stateVisible"

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical">

    <androidx.core.widget.NestedScrollView xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:fillViewport="true">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <com.google.android.material.textfield.TextInputLayout
                android:id="@+id/input_city_name"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginStart="20dp"
                android:layout_marginTop="32dp"
                android:layout_marginEnd="20dp"
                android:hint="@string/city_name"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintTop_toTopOf="parent">

                <com.google.android.material.textfield.TextInputEditText
                    android:id="@+id/city_name"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:digits="abcdefghijklmnopqrstuvwxyz ABCDEFGHIJKLMNOPQRSTUVWXYZ"
                    android:lines="1"
                    android:maxLength="100"
                    android:textSize="16sp" />

            </com.google.android.material.textfield.TextInputLayout>

        </androidx.constraintlayout.widget.ConstraintLayout>

    </androidx.core.widget.NestedScrollView>

    <Button
        android:id="@+id/submit"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimary"
        android:onClick="onSubmit"
        android:padding="12dp"
        android:text="@string/string_continue"
        android:textColor="#FFFFFF"
        app:layout_constraintBottom_toBottomOf="parent" />

</LinearLayout>

버전 2.2에는 제약 조건 레이아웃을 스크롤할 수 없는 버그가 있습니다.아직도 존재하는 것 같아요.선형 레이아웃 또는 상대 레이아웃을 대체하여 사용할 수 있습니다.

또한, 체크아웃: ScrollView 안에 구속조건 레이아웃을 넣을 수 있습니까?

제약 조건 레이아웃이 새 앱의 기본값입니다.저는 지금 "Android를 배우는 중"이고 키보드가 작동 중일 때 스크롤할 기본 "샘플" 코드를 처리하는 방법을 찾는 데 매우 어려움을 겪었습니다.저는 "제출" 버튼을 클릭하기 위해 키보드를 닫아야 하는 앱을 많이 보았고 가끔은 사라지지 않습니다.이 [ScrollView / ContraintLayout / Fields] 계층을 사용하면 지금 바로 작동합니다.이렇게 하면 스크롤 가능한 보기에서 제약 조건 레이아웃의 이점과 사용 편의성을 얻을 수 있습니다.

사용할 수 있습니다.HorizontalScrollView그리고 그것은 또한 작동할 것입니다!

이렇게 해결했습니다.
중첩 스크롤 보기를 사용하는 경우.제약 조건 레이아웃 내에서 스크롤 뷰를 사용한 다음 스크롤 뷰에 대해 "WRAP_CONTENT" 또는 "MATCH_PARENT" 대신 다음 구성을 사용합니다.

---

<ScrollView
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintBottom_toTopOf="@+id/someOtherWidget"
    app:layout_constraintTop_toTopOf="parent">

스크롤 뷰에서 높이 및 너비 0을 설정합니다. 위쪽_아래쪽_아래쪽_아래쪽_위쪽 구속조건을 추가합니다.

저에게는 하단 제약 조건을 제거하거나 스크롤 컨테이너를 true로 설정하는 제안이 전혀 효과가 없는 것 같습니다.효과: 아래와 같이 구속조건 레이아웃 편집기의 "수직으로 확장" 옵션을 사용하여 레이아웃에서 개별/내포된 보기의 높이를 확장하여 상위 보기를 "확장"할 수 있도록 합니다.

모든 접근 방식에서 점선 미리보기 선이 상위 또는 하위 치수를 벗어나 수직으로 확장되는 것이 중요합니다.

언급URL : https://stackoverflow.com/questions/43098150/android-how-to-make-a-scrollable-constraintlayout