Programming/Android

[Android Studio]레이아웃(Layout), 뷰(View) 기본

Rexter 2019. 6. 22. 07:20
반응형

1. 레이아웃의 종류

LinearLayout, RelativeLayout, FrameLayout, TableLayout

이 4가지를 주로 사용합니다.

 

 A. LinearLayout

  선형 구조 라고 해야 할지, 쭉~ 나열하는 느낌으로 쓸 때 좋은 구조 입니다.

  가령 텍스트뷰 3개를 배치 시킬 경우 레이아웃의 기본 방향을 따라 나란히 늘어서게 됩니다.

  겹쳐서 표현되지 않습니다.

 

 B. RelativeLayout

  레이아웃 안에 위치하는 것들이 상대적인 위치를 가질 수 있게 하는 구조 입니다.

  말이 좀 애매하긴 한데, A 라는 버튼을 하나 만들었을 때 기준위치를 정해서 화면의 크기라던지 상관 없이 나타낼 수 있게 해주는 구조라고 생각하시면 됩니다.

 

 C. FrameLayout

  잘 안 써서 설명이 좀 부족할 수 있긴 한데요.

  레이아웃 하나에 하나의 뷰 만 띄울 때 주로 쓴다고 합니다.

  기본 배치를 하기 위한 게 아니라 동적으로 뭔가를 보여주기 위해서 사용하는 경우가 있을 거 같긴 하네요.

 

 D. TableLayout

  말 그대로 테이블 형식의 레이아웃입니다.

  행, 열. 표 방식이라고 하면 이해가 빠를 거 같네요.

  윈도우 8에서 시작메뉴를 없애고 타일로 해서 욕을 꽤 먹었었는데, 암튼 그 타일 형식이랑 비슷하다고 생각하면 됩니다.

 

 근데 사실 테이블이나 그리드 레이아웃은 LinearLayout 으로 할 수 있습니다. 단지 좀 더 편한 옵션들이라고 해야 할지 인자들을 쓸 수 있는 정도의 차이입니다.

 

2. LinearLayout 의 기본 사용법

 안드로이드 스튜디오를 통해 프로젝트를 생성하면 메인 레이아웃이 자동으로 하나 만들어집니다.

 activity_main.xml 파일을 열어보면 보통은 ConstraintLayout 안에 텍스트뷰 하나가 있을 겁니다.

 텍뷰는 일단 레이아웃 확인용으로 놔두도록 하죠.

 <LinearLayout></LinearLayout> 형태로 하나의 레이아웃을 구성합니다.

 안드로이드 스튜디오의 자동완성 기능으로 보통 레이아웃의 가로와 세로에 대한 부분을 설정하도록 되어 있는데요, 제일 바깥에 위치할 레이아웃의 경우 match_parent 값을 줘서 전체 영역을 쓸 수 있도록 설정해 주세요.

 그리고 android:orientation="" 부분을 추가해 주시면 되는데 vertical 은 세로 방향으로 나열하겠다는 거고, horizontal 은 가로 방향으로 나열하겠다는 겁니다.

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

  ~~~

  </LinearLayout>

요건 세로로 나열하겠다는 게 되겠지요.

 

이렇게 기본 틀을 만든 후 ~~~ 부분에 버튼이나 텍스트뷰 같은 것들을 위치시키면 됩니다.

 

레이아웃에도 gravity 나 weight 을 줄 수 있는데, 이건 다음에 자세히 다루도록 하겠습니다.

 

3. GridLayout 기본 사용법

 레이아웃 자체에는 별다를 게 없습니다.

 단지 android:columnCount, android:rowCount 항목을 지정해서 행과 열의 최대값을 지정해 준 후 별다른 추가 없이 그냥 나열만 하면 알아서 행과열에 맞춰서 배치 된다는 게 차이날 뿐입니다.

<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="4"
android:rowCount="4">

~~~

</GridLayout>

이렇게 한 후 ~~~ 부분에 버튼을 그냥 5개 나열하면 4개짜리 한 줄, 1개 한 줄 이렇게 배치가 됩니다.

 

4. TableLayout 기본 사용법

 사용할 뷰들을 <TableRow> </TableRow> 사이에 배치 시키면 됩니다.

 html 에서 사용하는 td tr 이런 것들과 같은 방식이라고 보시면 됩니다.

 

RelativeLayout 은 상대적인 위치를 지정하거나 할 수 있기 때문에 커스텀 다이얼로그 등에서 쓰일 수 있습니다.

요 레이아웃은 나중에 따로 자세하게 다루도록 하겠습니다.

반응형