레이아웃

본 내용은 필자가 공부한 내용을 정리한 것으로 틀리거나 잘못된 내용이 있을 수 있습니다.

 

---

레이아웃은 view를 배치하는 과정에서 view를 묶어주고, 위치를 정렬, 그룹화하는 역할을 합니다. 

 

레이아웃들은 view를 자식으로 담을 수 있습니다.

 

레이아웃은

• Linear Layout
• Constraint Layout
• Frame Layout
• Table Layout

등을 주로 사용합니다.

 

 

1. Linear layout

linear layout은 선형 레이아웃으로 쌓아가듯이 나열하는 방식의 레이아웃입니다. 

orientation이란 속성을 설정하여 가로로 나열할지, 세로로 나열할 지 정할 수 있습니다. 

orientation의 기본값으로는 horizontal, 가로로 나열되도록 되어있습니다. 

또, view를 중첩하여 나열할 수 없습니다. 

orientation: vertical

orientation: horizontal

 

 

2. Constraint Layout

두 번째는 기본으로 제공될 때 있던 레이아웃, constraint layout입니다. 

서로 간의 관계를 이용해 배치하는 레이아웃입니다.

textView의 속성에는 layout_constraint~~~~가 붙어있습니다. 

layout_constraint~~는 위치를 제약조건에 따라 배치한다는 뜻입니다. 

 

예를 들어, layout_constraintBottom_toBottomOf="parent"는 

constraint(자신)의 bottom(바닥)을 parent의 바닥에 연결시킨다는(toBottomOf) 것입니다.

여기서 parent는 constraint layout을 의미하겠죠?

 

그리고 굳이 이를 코드로 작성해줄 필요도 없습니다. 

디자인뷰에서 마우스로 직접 끌어다 놓을 수 있기 때문입니다. 마우스로 간단하게 제약을 걸 수 있습니다. 

 

추가로, 제약을 초기화하고 싶을 때는 제약이 된 파란 동그라미를 선택한 후, del키를 누르면 초기화됩니다. 

 

 

이 constraint에서는 두 개 이상의 (가로와 세로로 구성된)제약을 걸지 않으면 위치를 특정할 수 없기 때문에 에러가 발생하거나 앱을 구동시켰을 때 위치가 이상해질 수 있습니다. 

 

이 레이아웃 역시 중첩은 불가능합니다. 

 

더 자세한 내용은 다음 글을 참조하시면 좋을 것 같습니다.

https://recipes4dev.tistory.com/158

안드로이드 컨스트레인트레이아웃. (Android ConstraintLayout)

 

3. Frame Layout

Frame Layout은 view를 중첩을 할 수 있는 레이아웃입니다. 

Frame layout에 자식을 추가하면 가장 최근에 추가된 view가 가장 위로 올라오면서 겹쳐지게 할 수 있습니다. 

visible을 조정하면서 여러 개의 view를 중첩할 수도 있습니다. 

 

 

4. Table Layout

Table Layout은 격자, 표와 같은 형태의 레이아웃을 만들 때 쓰이는 레이아웃입니다.

<TableLayout
        android:layout_width="409dp"
        android:layout_height="354dp"
        tools:layout_editor_absoluteX="1dp"
        tools:layout_editor_absoluteY="1dp">

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TableRow
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </TableLayout>

테이블 레이아웃 안에 TableRow를 만들면서 채워나갈 수 있습니다. 

 

 

 

5. 추가로...

레이아웃 안에 레이아웃을 또 만듦으로써 더욱 복잡한 레이아웃을 만들 수 있습니다.

또한, 굳이 코드로 작성할 필요가 없습니다. design 탭이나 split탭에서 마우스로 끌어다 놓은 식으로도 레이아웃을 꾸밀 수 있습니다.