1.LinearLayout - 1편

Posted by ITPangPang
2016. 3. 19. 16:26 안드로이드(android)/레이아웃(Layout)



LinearLayout





가장 기초적인 Layout의 종류로 사용하기도 편리한 Layout

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">

</LinearLayout>

위의 코드에서 <LiearLayout> ~~ </LinearLayout> 사이에 원하는 Widget이든, Layout이든 넣을 수 있다.

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

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

</LinearLayout>

LinearLayout 사이에 TextView 하나와 Button 하나를 넣었다.

결과는 위와 같이 나온다. 가장 기본적인 Layout의 

width(가로),height(세로)가 있다.

가로,세로의 속성 2가지를 먼저 보자면

1.match_parent => 화면의 전체 차지

(fill_parent와 같으나 deprecated 됬으므로 match를 쓰자)

2.wrap_content => 내용물 만큼 자리를 차지


위 LinearLayout에서 android:layout_width="match_parent, 

android:layout_hight="match_parent

가로 세로 둘다 match로 적용 시켰으므로 

위와같이 화면 전체를 쓰겠다는 의미이다.


코드에서 TextView에 아무 Text도 입력시키지 

않아 화면에서는 없는것처럼 보인다.


<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">

<TextView
android:text="Hi"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

</LinearLayout>


이번에는 LinearLayout의 android:layout_height를 

wrap_content으로 바꿧더니 차지하는 영역이

확 줄어들었다. TextView와 Button이 

차지하는만큼 맞춰서 공간확보를 한다.

그리고 TextView에 "Hi"를 넣었더니 

TextView도 보이기 시작했다.


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

<TextView
android:text="Hi"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:text="Hi"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

</LinearLayout>

이번에는 android:orientation이라는걸 넣었다. 

말 그대로 방향이란 뜻이다. 2가지 속성을 보자

1.vertical : 말그대로 수직, 세로의 뜻이다. 아래로 쫙 뿌려준다

2.horizontal : 말그대로 수평, 가로의 뜻이다. 옆으로 쫙 뿌려준다

위의 코드에서 vertical로 설정했기 때문에 

TextView 다음 Button이 바로옆에 생성되는 것이 아니라

아래에서 생성된다. horizontal로 하면 옆에 생성된다.


다음 TextView와 Button에 공통적으로 gravity가 들어가있다. 

하나는 layout_gravity, 하나는 gravity

똑같이 gravity가 들어가있는것들 center(중앙)으로 설정했는데 

TextView만 중앙에서 생성되있다.

이것도 그냥 말그대로 이해하면 쉬운데 클릭을 해보면

Hi가 써있는 TextView의 layout_width는 wrap_content이다 

그러므로 클릭했을때 Hi라는 글씨만큼 쪼그마하게 차지하는걸 알 수 있다. 

그냥 gravity는 저 조그마한 공간안에서 정렬을 시키는것이므로 

gravity="center" 해봐야 의미가 없다

여기서 전체 LinearLayout의 layout_width는 match이다

layout_gravity는 layout(TextView)을 정렬시키는 것이다. 

orientation을 vertical로 주었기때문에

맨 위에 한줄은 TextView만의 공간이다. 

그 전체공간에서 TextView를 center로 정렬시키는 것이다.


말로 쓰자니 어렵다.. 몇가지 바꿔가면서 정렬을 시켜보자면..

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

<TextView
android:text="Hi"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<Button
android:text="Hi"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

</LinearLayout>

<LinearLayout

    android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:text="Hi"
android:layout_gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:text="Hi"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

</LinearLayout>

<LinearLayout

    android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:text="Hi"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:text="Hi"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

</LinearLayout>

Layout 기준으로 정렬을 시킬것인가 안에 내용물 기준으로 정렬을 시킬것인가 생각해서 잘 배치시키면 된다.