BuNa_
IT Story
BuNa_
전체 방문자
오늘
어제
  • 분류 전체보기 (117)
    • CS (14)
      • 운영체제 (8)
      • 네트워크 (0)
      • Design Pattern (1)
      • OOP (4)
    • 대외활동 (24)
      • 우아한테크코스 (14)
      • DND 동아리 (4)
      • UMC 동아리 (5)
      • 해커톤 (1)
    • Android (29)
      • MVVM (2)
      • 스터디 (11)
      • Compose (3)
      • Unit Test (1)
    • Project (5)
      • 어따세워 (5)
      • DnD 과외 서비스 (0)
    • Programming (11)
      • Kotlin (4)
      • 파이썬 (7)
    • Git (1)
    • 인공지능 (22)
    • 백준 (8)
    • 기타 (3)
      • IntelliJ (1)
      • 일상 (0)

블로그 메뉴

  • 홈

공지사항

인기 글

태그

  • RecyclerView
  • K-means
  • UMC
  • 우테코
  • ViewModel
  • Ai
  • 원시값 포장
  • 외부 단편화
  • 선형회귀
  • 운영체제
  • 어따세워
  • Compose
  • 파이썬
  • 딥러닝
  • 컴공선배
  • 다이나믹 프로그래밍
  • 인공지능
  • 인공지능 분류
  • MVVM
  • External fragmentation
  • 객체지향 생활체조
  • 백준
  • 우아한테크코스
  • 우테코 프리코스
  • Baekjoon
  • k-means++
  • 안드로이드
  • Android
  • 셀레니움
  • 우테코 5기

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
BuNa_

IT Story

[Android] ConstraintLayout을 사용해야 하는 이유
Android/스터디

[Android] ConstraintLayout을 사용해야 하는 이유

2023. 2. 22. 15:39

 

최근 github의 안드로이드 프로젝트의 xml을 확인해 보면, 거의 대부분의 프로젝트가 레이아웃을 ConstraintLayout을 채택하고 있습니다.

뿐만 아니라, 안드로이드 스튜디오에서 새로운 프로젝트를 생성하면 기본 레이아웃으로 ConstraintLayout을 제공하고 있습니다.

 

기존에 사용되던 LinearLayout, RelativeLayout 등 여러 Layout이 있음에도 불구하고 ConstraintLayout을 사용하는 이유는 무엇일까요?

 

ConstraintLayout 

ConstraintLayout은 안드로이드에서 제공하는 레이아웃(Layout) 중 하나로, 뷰(View)를 배치할 때 제약 조건(Constraint)을 사용하여 제어하는 방식을 사용합니다.

기존의 LinearLayout, ReleativeLayout 등의 레이아웃은 뷰의 위치를 상대적으로 지정하는 방식이었습니다.

예를 들어, LinearLayout에서는 뷰를 Vertical, Horizontal 하게 배치할 수 있고, RelativeLayout은 뷰를 상대적으로 배치할 수 있었습니다.

 

하지만, ConstraintLayout은 뷰 간의 관계를 제약 조건(Constraint)으로 지정하여 뷰의 위치를 지정하는 방식입니다.

제약 조건은 뷰의 상하좌우와 같은 위치, 크기, 비율 등을 지정할 수 있으며, 이를 통해 다양한 레이아웃을 구성할 수 있습니다.

 

 

ConstraintLayout 장점

그럼 제약 조건을 통해 뷰를 배치하는 것이 어떠한 장점이 있을까요?

가장 큰 장점으로는 뷰의 깊이(depth)를 줄일 수 있기 때문입니다.

뷰의 깊이를 줄이면 아래와 같은 이점이 따라옵니다.

 

1. 성능 최적화

2. 가독성 증대

 

먼저, 성능 최적화에 대해 이야기해 보겠습니다.

 

우선, ConstraintLayout을 사용하면 1 depth만으로도 복잡한 화면을 구성할 수 있습니다.

뷰의 깊이는 뷰 계층 구조에서 한 뷰가 다른 뷰 위에 쌓이는 깊이를 의미합니다.

 

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="1st Level"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="2nd Level"/>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="3rd Level"/>

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="3rd Level"/>

        </LinearLayout>

    </LinearLayout>

</LinearLayout>

 

예를 들어, LinearLayout 안에 또 다른 LinearLayout이 있고, 그 안에 LinearLayout이 있다면, 이때 뷰 계층 구조에서는 3단계(depth)를 가집니다.

 

뷰의 깊이를 줄이는 것은 뷰 계층 구조를 단순화하고 레이아웃을 계산하는 데 필요한 시간과 자원을 줄일 수 있습니다.

Android 공식문서에 따르면 16ms당 1 프레임을 렌더링 해주어야 앱이 버벅거린다는 느낌을 받지 않습니다.

 

뷰의 깊이가 깊어질수록 UI 렌더링은 오래 걸립니다.

그 이유는 다음과 같습니다.

 

1. 레이아웃 계산 시간 증가

깊은 뷰 계층 구조를 가진 레이아웃을 렌더링 하면, 뷰 계층 구조를 계산하는 데 많은 시간이 걸립니다. 레이아웃 계산은 뷰 계층 구조의 크기와 복잡성에 따라 비례하여 늘어납니다.

 

2. 뷰 계층 구조 복잡성 증가

뷰의 깊이가 깊어질수록 뷰 계층 구조가 더 복잡해지며, 뷰 계층 구조 내에서 뷰들 간의 상호작용이 복잡해집니다. 이로 인해 UI 이벤트 처리 및 애니메이션 처리 시간이 오래 걸립니다.

 

3. 뷰 계층 구조 변경 시간 증가

뷰 계층에 동적으로 뷰를 추가, 제거 또는 변경하는 데에 오랜 시간이 걸립니다.

 

4. 메모리 사용 증가

깊은 뷰 계층 구조를 가진 레이아웃일수록 메모리를 많이 사용합니다.

안드로이드에서는 뷰 계층 구조에 대한 정보를 저장하기 위해 메모리를 사용하는데, 뷰 계층 구조가 깊어질수록 메모리 사용량도 늘어납니다. 특히, 안드로이드에서 크게 고려해야 하는 OOM(Out Of Memory)가 발생하지 않도록 최적화하는 데에 도움이 됩니다.

 

 

ConstraintLayout은 뷰의 깊이를 줄이면서도 레이아웃을 유연하게 구성할 수 있는 기능을 제공합니다.

ConstraintLayout은 제약 조건(constraint)을 사용하여 뷰를 배치하므로, 뷰 계층 구조가 깊어지지 않고도 복잡한 UI를 만들 수 있습니다.

 

 

 

그다음으로는, 가독성 측면입니다.

 

뷰의 깊이를 줄이면 코드의 가독성 또한 향상됩니다.

뷰 계층 구조가 깊다는 것은 그만큼 사람이 보기에 복잡한 구조라는 신호일 수 있습니다.

그렇기 때문에 코드가 복잡하고 유지보수하기 어려워지는 문제가 발생합니다.

 

ConstraintLayout은 뷰의 깊이를 줄일 수 있기 때문에 훨씬 간결하고 높은 가독성을 가질 수 있습니다.

 

 

 

 

github : https://github.com/tmdgh1592

 

tmdgh1592 - Overview

느리더라도 천천히..!! 😁. tmdgh1592 has 21 repositories available. Follow their code on GitHub.

github.com

 

 

저작자표시 비영리 변경금지 (새창열림)

'Android > 스터디' 카테고리의 다른 글

[Android] Thread의 interrupt()와 stop()  (0) 2022.05.02
[Android] ViewTreeObserver를 이용하여 View가 그려지는 시점을 알아보자! (getWidth(), getHeight()의 출력값이 0인 경우..)  (0) 2022.02.19
쿠키(Cookie)와 세션(Session)을 이용한 로그인  (2) 2022.01.21
[Android] 안드로이드 Strings.xml 국가별 언어 설정 방법 및 국가 코드 정리  (5) 2021.12.28
[Android] RecyclerView LayoutPosition vs AdapterPosition 차이를 알아보자!  (0) 2021.12.22
    'Android/스터디' 카테고리의 다른 글
    • [Android] Thread의 interrupt()와 stop()
    • [Android] ViewTreeObserver를 이용하여 View가 그려지는 시점을 알아보자! (getWidth(), getHeight()의 출력값이 0인 경우..)
    • 쿠키(Cookie)와 세션(Session)을 이용한 로그인
    • [Android] 안드로이드 Strings.xml 국가별 언어 설정 방법 및 국가 코드 정리
    BuNa_
    BuNa_
    안드로이드 개발자를 향해 달리고 있는 공대생입니다! 🧑 Android, Kotlin, Java, Python 등 학습하고 있는 내용과 프로젝트를 주로 업로드하고 있습니다. 지적과 조언은 언제나 환영입니다!😊 github : https://github.com/tmdgh1592

    티스토리툴바