[ 레이아웃 (Layout) ]

화면 안에 넣은 뷰(TextView, EditText 등)의 크기와 위치를 정할 수 있도록 도와줍니다.

[ 5가지 대표 레이아웃 ]

>> ConstraintLayout (제약 레이아웃)

제약 레이아웃은 제약 조건(Contraint)을 사용해 그 안에 들어 있는 뷰를 배치합니다.

>> LinearLayout (리니어 레이아웃)

리니어 레아이웃은 박스(Box)모델을 사용하는 레이아웃입니다.
창고 안에 박스를 쌓을 때 아래에서 위로 쌓는 것처럼 뷰가 차지하는 영역을 박스라고 보고 한 쪽 방향으로 쌓게 됩니다

• 가로 방향은 Horizontal
• 세로 방향은 Vertical

로 지정하는데 단순히 쌓기만 하면 되므로 아주 쉬운 레이아웃입니다.
단순해 보이지만 리니어 레이아웃 안에 다시 리니어 레이아웃을 사용하면 아주 복잡한 화면도 만들 수 있습니다.

>>>> 수평적 리니어 레이아웃

<!-- 수평 LinearLayout -->
<LinearLayout
    ...
    android:orientation="horizontal"
>

>>>> 수직적 리니어 레이아웃

<!-- 수직 LinearLayout -->
<LinearLayout
    ...
    android:orientation="vertical"
>

>>>> 뷰 정렬하기

리니어 레이아웃에서 뷰를 정렬하기 위해서는 gravity 또는 layout_gravity속성을 사용할 수 있습니다.

• gravity : 뷰 안에 표시하는 내용물을 정렬
• layout_gravity : 부모 컨테이너의 여유공간 내에서 뷰 정렬

리니어 레이아웃에 버튼과 텍스트 뷰를 추가한 후,
버튼에는 layout_gravity 속성을, 텍스트 뷰에는 gravity속성을 지정하였습니다.

>> RalativeLayout (상대 레이아웃)

상대 레이아웃은 제약 레이아웃(Constraint Layout)이 나오기 전에 디폴트 레이아웃으로 사용되던 레이아웃입니다.
부모 컨테이너나 다른 뷰와의 상대적인 위치를 이용해 뷰의 위치를 결정할 수 있습니다.
예를 들어, 버튼을 부모 컨테이너의 위쪽에 붙이고 싶다면 부모 컨테이너라는 타겟(Target)에 붙여야 합니다.
레이아웃을 사용하면 이때 필요한 속성을 제공합니다.

>> FrameLayout (프레임 레이아웃)

프레임 레이아웃은 가장 상위의 뷰 또는 그룹 하나만 보여주는 레이아웃입니다.
만약 그 안에 여러 개의 뷰나 뷰그룹을 추가했다면 나머지는 그 아래에 중첩되어 쌓입니다.
아주 간단한 레이아웃이라서 자주 사용되지 않을 것 같지만 상당히 많이 사용됩니다.
왜냐하면, 한 번에 하나의 뷰만 보여주면서 나머지는 보이지 않게 그 아래에 숨겨두었다가 그 중에 특정 뷰를 보이거나 보이지 않도록 하면 손쉽게 뷰를 전환할 수 있기 때문입니다.

다음은 프레임 레이아웃 위에 1, 2, 3 세 개를 순차적으로 올려놓은 모습이고 자동으로 중첩하여 올라갑니다.

가장 상위에 있는 1가 가장 앞으로 나와있는 모습이고
그 다음의 2이 1가 차지하고 있는 부분은 가려진 채로 화면에 표시되고 있습니다.
가장 아래에 있는 3은 두 뷰가 가린 부분을 제외한 부분만을 표시하고 있습니다.

>> TableLayout (테이블 레이아웃)

테이블 레이아웃은 격자 모양의 배열로 화면을 구성하는, 표 모양의 레이아웃입니다.
HTML에서 사용하는 방식과 유사하여 실용적이지만 자주 사용하지는 않습니다.
왜냐하면 나중에 배울 그리드뷰(GridView)라는 위젯이 거의 유사한 기능을 제공하기 때문입니다.

테이블 레이아웃을 추가하게 되면, TableRow 태그가 자동으로 추가되어 있는데, TableRow안에 여러개의 뷰를 추가할 수 있습니다.

TableLayout에 TableRow의 개수가 행의 개수가 되고, 각 TableRow에 들어있는 뷰의 개수가 열의 개수가 됩니다.

위와 같은 형식으로 일정 간격으로 뷰가 배치되어 있습니다.

[ 스크롤뷰 (ScrollView) ]

그 외에도 스크롤뷰(ScrollView)는 어떤 뷰의 내용물을 그 뷰가 차지하는 화면 영역을 벗어나는 경우 간단하게 스크롤을 만들 수 있는 뷰를 제공합니다.

[ 뷰의 기본 속성 ]

<View
    android:layout_width="wrap_content/match_parent"
    android:layout_height="wrap_content/match_parent">
    
    ...
</View>

width는 뷰의 가로 길이를 height은 뷰의 세로 길이를 설정합니다.
여기서 wrap_content값은 뷰에 들어있는 값에 따라 크기를 자동적으로 할당해주고
match_parent값은 부모 레이아웃 모두를 할당하는 것을 의미합니다.

[ 뷰의 영역 ]

레이아웃을 하나씩 다뤄보려면 뷰가 갖고 있는 공통 특성을 간단하게 알아보아야 합니다.

뷰가 레이아웃에 추가될 때 보이지 않는 뷰의 테두리가 있다는 것을 생각해야합니다.
이것을 흔히 뷰의 영역이라고 부릅니다
이 테두리를 기준으로 바깥쪽과 안쪽 공간을 띄웁니다.
테두리 바깥쪽 공간을 마진(Margin), 테두리 안쪽 공간을 패딩(Padding)이라고 부릅니다.

이처럼 뷰의 테두리와 레이아웃 사이의 거리를 마진(Margin)이라 부르고
뷰 안의 내용물과 뷰의 테두리 사이를 패딩(Padding)이라 부릅니다.

[ 뷰의 배경색 ]

레이아웃을 사용하다 보면 그 안에 있는 뷰들을 확실하게 구분해서 표시하고 싶을 때가 많습니다.
이때 가장 쉽게 사용할 수 있는 방법이 배경색을 설정하는 것입니다.

이때 background라는 속성을 사용합니다.
xml 레이아웃에서 색상을 지정할 때는 # 기호를 붙인 후
ARGB ( A : Alpah, R : Red , G : Green, B : Blue )의 순서대로 색상 값을 기록합니다.

[ Format ]

• #RGB

• #ARGB

• #RRGGBB

• #AARRGGBB

  16진수를 이용하여 기록하며 여기서 A는 투명도를 가르킵니다.

  이미지를 배경색으로 지정할 수도 있습니다.