안드로이드 레이아웃 종류

2020. 3. 13. 20:11프로그래밍/안드로이드

Layout

앱에서 사용자 인터페이스를 위한 구조를 정의. 레이아웃의 모든 요소는 View ViewGroup 객체의 계층을 사용하여 빌빌드하고, 위젯의 위치를 정렬하거나, 연관된 위젯들을 그룹화하는 역할을 수행한다.레이아웃에는 LinearLayout , RelativeLayout, FrameLayout, TableLayout, GridLayout, cons 이렇게 6가지 종류가 있다.

 

1. LinearLayout

세로 또는 가로의 단일 방향으로 모든 하위 요소를 정렬하는 뷰 그룹이다. 뷰 객체들은 위치가 중복되지않는다.

속성

-orientation: 뷰의 배치방향을 설정하는 속성이다. 

    android:orientation="vertical" : 수직(세로)방향으로 배치

    android:orientation="horizontal" : 수평(가로)방향으로 배치

-gravity: 레이아웃 내부에 위젯을 어디에 배치할지 위치를 결정하는 속성

           ex)android:gracity="right||bottom"

-layout_gravity: 자신의 위치를 부모의 어디에 배치할지를 결정하는 속성

                     ex)android:layout_gracity="left"

 

2. RelativeLayout

자식 뷰 또는 부모 뷰 간의 관계에 따라 배치를 적용하는 레이아웃

 

뷰의 위치 속성

기준뷰에 따른 위치결정
   
 layout_above 뷰를 기준뷰의 위에 배치
 layout_toRightOf 뷰를 기준뷰의 오른쪽에 배치
 layout_below 뷰를 기준뷰의 아래쪽에 배치
 layout_toEndOf 뷰를 기준뷰의 끝쪽에 배치
부모 뷰 내부에 따른 위치결정
 layout_alignParentLeft: 뷰를 부모 내의 왼쪽에 배치
 layout_alignParentTop 뷰를 부모 내의 위쪽에 배치
 layout_alignParentTo 뷰를 부모 내의 위쪽에 배치
 layout_alighnParentRight 뷰를 부모 내의 오른쪽에 배치
 layout_alighnParentBottum 뷰를 부모 내의 아래쪽에 배치
 layout_centerHorizontal 뷰를 부모의 가로 방향 가운데 배치
 layout_conterVertical 뷰를 부모의 세로방향 가운데 배치
 lauout_centerlnParen 뷰를 부모의 중앙에 배치
 layout_alignParentStar 뷰를 부모의 시작지점에 배치
 layout_alignParentEnd 뷰를 부모의 끝 지점에 배치
맞춤 정렬
 layout_alignLeft 뷰의 왼쪽을 기준 위쪽에 배치
 layout_alignTop 뷰의 위를 기준  부의 위에 맞춤
 layout_algnRight 뷰의 오른쪽을 기준 뷰의 오른쪽에 맞춤
 layout_alignBottom  뷰의 아래를 기준 뷰의 아래에 맞춤
 layout_alignBaseline 뷰의 폰트 기준선을 기준뷰의 폰트기준선에 맞춤

3. FrameLayout

여러 개의 뷰를 중첩으로 배치하고 그중 하나를 레이아웃의 전면에 표시할 때 사용하는 레이아웃

FrameLalyout의 특성

  • 화면이 중복되기 때문에 단일 하위뷰 사용을 권장하지만 layout_gracity속성을 사용해 뷰의 위치를 조정을 통행 여러 하위뷰 구성이 가능하다. ex)android:layout_gravity="leftltop"
left|top center_horizontal|top right|top
left|center_vertical center right|center_vertical
left|bottom center_horizontal|bottom right|bottom

-위치별 속성값-                                          

  • 레이아웃의 layout_width, layout_height의 값이 wrap_content인 경우, 크기는 자신에게 포함된 자식 뷰 위젯 중에서 가장 큰 뷰에 맞춰진다.
  • 여러개의 자식 뷰를 추가하면 가장 마지막에 추가한 뷰가 전면에 표시되는 것을 기본으로 한다.

4. TableLayout

행과 열로 이루어진 표 형태의 구조를 가진 레이아웃

  • TableLayout 아래 TableRow를 선언하여 행 추가, TableRow아래 뷰 위젯을 선언하여 열을 추가한다.  
  • 열의 갯수는 가장 많은 위젯을 가진 TableRow에 맞춰진다
    ex)

<TableLayout ...>

    <TableRow ...>

        <TextView ... androidid:text="A" />

        <TextView ... androidid:text="B" />

        <TextView ... androidid:text="C" />

        <TextView ... androidid:text="D" />

    </TableRow>

 

    <TableRow ...>

        <TextView ... androidid:text="1" />

        <TextView ... androidid:text="2" />

    </TableRow>

 

    <TableRow ...>

        <TextView ... androidid:text="a" />

    </TableRow>

</TableLayout>

A B C D
1 2    
a      

 

5.GridLayout

TableLayout의 단점을 보완한 레이아웃으로 직관적인 행렬선언과 셀 병합이 가능하다.

속성

  • orientation: 배치의 방향
  • columnCount: 최대 열의 개수 지정
  • rewCount:최대 행의 개수 지정
  • alignmentMode : 정렬의 기준 지정. alignBounds=차일드 외곽기준, alignMargins=마진을 기준(디폴트값)
  • layout_column: 차일드가 배치될 셀의 열 좌표를 지정
  • layout_row: 차일드가 배치될 셀의 행 좌표를 지정
  • layout_columnSpan: 차일드가 차지할 열 수를 지정
  • layout_rowSpan: 차일드가 차지할 행수를 지정
  • layout_gravity: 열 내에서의 차일드 정렬방식 지정

 

6. constraintLayout

뷰 위젯의 위치와 크기를 유연하게 조절할 수 있게 만들어주는 레이아웃. 렐러티브레이아웃의 "상대적 위치 관계에 따른 배치" 특성에 리니어레이아웃(LinearLayout)의 "가중치(weight)가 가진 장점"을 적용하고, 체인(chain) 사용으로 다른 레이아웃 없이 "요소들을 그룹화"가 가능하다.

 

제약조건

  • "layout_cinstraint"로 시작하는 구체적인 제약조건 명시
Relative positioning 요소간 상대 위치 지정(left,right, top, bottom, start, end, baseline)
Margins 요소간 여백(Margin) 설정을 위한 제약
Centering positioning 뷰를 부모 레이아웃 또는 제약 영역의 중앙에 배치
Circular positioning 대상 뷰를 기준으로 각도와 반지름으로 상대위치 지정
visibillty behavior 뷰의 Visibillty 상태에 따른 최종 위치 결정 및 여백
dimension comstraints 뷰에 적용된 제약에 따른 뷰의 크기 결정
chains 수평 또는 수직 방향으로 나열된 뷰에 대한 그룹화. 배치 스타일 지정
Virtual Helpers objects 레이아웃 내 효율적인 뷰 배치에 사용 가능한 몇가지 Helper객체들(Guideline, Barreir, Group)
Optimizer 제약 카테고리에 대한 최적화

'프로그래밍 > 안드로이드' 카테고리의 다른 글

안드로이드 4대 컴포넌트  (0) 2020.03.16
android Layout - 팔레트 종류와 기능  (0) 2020.03.13
manifest  (0) 2020.03.09