🚧 layout_constrainedHeight/Width로 가변 길이 설정하기

ConstraintLayout을 사용할 때 layout_height = "wrap_content"로 지정하면 제약 조건에 맞게 알아서 설정될 줄 알았다. 하지만 아이템의 개수가 많아지면 버튼 아래 쪽으로 뷰가 넘어가는 문제가 발생하였습니다.

<androidx.constraintlayout.widget.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="@color/black">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/url_music_chord_container"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="16dp"
        android:layout_marginBottom="32dp"
        android:background="@drawable/bg_url_chord_rv"
        app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
        app:layout_constraintBottom_toTopOf="@+id/url_music_play_btn"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0"
        app:spanCount="4"
        tools:itemCount="12"
        tools:listitem="@layout/item_url_chord" />

    <Button
        android:id="@+id/url_music_play_btn"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_marginBottom="32dp"
        android:background="@null"
        android:text="ok"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

버튼 위에서 뷰가 끝나야 하지만 버튼을 넘어가게 표시됨

이 경우, layout_constrainedHeight="true" 속성을 사용하면 제약조건에 맞게 뷰가 넘어가지 않는 것을 확인할 수 있습니다.

<androidx.constraintlayout.widget.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="@color/black">

    <androidx.recyclerview.widget.RecyclerView
        ...
        app:layout_constrainedHeight="true"
        ... />

    <Button
        ... />
</androidx.constraintlayout.widget.ConstraintLayout>

속성 추가 후 제약 조건에 맞게 뷰가 표시됨

 

📌 RecyclerView 외에도 TextView와 같이 길이가 변하는 뷰를 설정할 때, app:layout_constrainedWidth=”true”, app:layout_constrainedHeight=”true” 속성을 사용하여 제약조건에 맞게 뷰를 설정할 수 있습니다.

 

END