android

Android XML Layout

Seon Dev Notes 2025. 6. 9. 18:14

오늘은 안드로이드 앱을 만들 때 가장 먼저 구성하게 되는 것이 바로 화면, 즉 UI입니다. 그리고 이 UI를 만드는 대표적인 방법이 XML Layout에 대해 알아보겠다!

XML Layout

XML Layout은 안드로이드에서 앱의 화면에 보여질 UI 요소들을 배치하고 구성하는 파일이다.
버튼, 텍스트, 이미지 등 뷰(View)를 어떤 위치에 어떤 스타일로 보여줄지를 미리 선언적으로 작성할 수 있다.

기본 구조

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="안녕하세요!" />

    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="확인" />
</LinearLayout>
  • 최상단 태그는 보통 ViewGroup (LinearLayout, ConstraintLayout 등)
  • android:layout_width, android:layout_height는 모든 View에 필수이다.

layout_width / layout_height 속성

  • match_parent: 부모 크기에 맞게 채움
  • wrap_content: 내용 크기만큼만 공간 차지
  • dp: 고정 크기 지정 (Density-independent Pixel)

주요 layout 종류

LinearLayout
뷰들을 수직 또는 수평 방향으로 일렬 배치

  • android:orientation="vertical" 또는 "horizontal"
<LinearLayout android:orientation="vertical"> 
  <TextView ... /> 
  <Button ... /> 
</LinearLayout>

이렇게

RelativeLayout
뷰들을 서로의 위치 기준으로 배치 (예: 다른 뷰 아래, 오른쪽 등)

<RelativeLayout>
    <TextView android:id="@+id/title" ... />
    <Button android:layout_below="@id/title" ... />
</RelativeLayout>

ConstraintLayout
뷰에 제약 조건(Constraint) 을 주어 유연하고 효율적인 배치 가능

  • 복잡한 레이아웃도 중첩 없이 한 번에 구성 가능

<androidx.constraintlayout.widget.ConstraintLayout>
  <TextView app:layout_constraintTop_toTopOf="parent" app:layout_constraintStart_toStartOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>

XML Layout 사용 시 팁

미리보기 기능(Preview)을 활용하면 실제 UI 형태를 즉시 확인 가능

  • tools: 속성을 이용하면 디자인 전용 더미 데이터를 넣을 수 있음
<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    tools:text="디자인 전용 텍스트" />
  • RelativeLayout은 간단한 화면에서는 유용하지만, 복잡한 레이아웃에서는 중첩이 많아져 성능에 영향을 줄 수 있다.
  • ConstraintLayout은 그 단점을 보완하고, 더 복잡하고 유연한 UI를 한 단계로 처리할 수 있게 설계된 최신 레이아웃이다.

'android' 카테고리의 다른 글

Android Kotlin 변수와 자료형  (0) 2025.06.17
Android TextField에서 사용하는 VisualTransformation  (0) 2025.05.07
Android Module & Multi-Module  (0) 2025.04.29
Android clickable  (0) 2025.04.25
Android build-logic  (0) 2025.04.14