안녕하세요
오늘은 안드로이드 UI의 개발에서 가장 중요한 Layout에 대하여 기록하겠습니다.
기본적으로 Layout의 3 대장이라는 Layout에 대하여입니다.
3대 대장은
Linear Layout , Frame Layout , RelativeLayout입니다.
1. Linear Layout
|
1
2
3
4
5
6
|
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="">
</LinearLayout>
|
cs |
위와 같은 모습으로
특징으로는 방향성 (orientation)이 존재하는 것입니다.
vertical :수직
horizontal : 수평
두 가지 속성을 가지고 있으며
또 다른 특징으로는 자식 객체(안에 포함하고 있는 객체 ex:TextView, Button.. 등)가 겹쳐서 표현하지 못합니다.
android:layout_width : 객체의 넓이
android:layout_height : 객체의 높이
-- width, height 속성
match_parent : 부모 영역의 넓이만큼 차지하게 됩니다.
wrap_content : 내용만큼만 넓이를 사용합니다.
2. FrameLayout
|
1
2
3
4
5
6
|
<FrameLayout
android:layout_width=""
android:layout_height=""
android:layout_margin="">
</FrameLayout>
|
cs |
FrameLayout의 특징으로는
모든 자식 객체의 요소들을 전부 겹쳐서 나타냅니다.
디자인적인 요소로 많이 사용되며
요소를 움직이기 위해서는
android:layout_margin="" ---> 바깥쪽 여백 주기
android:layout_gravity="" ---> 현재 속성을 가진 객체를 통째로 위치 변환시키기(ex: center, bottom 등)
이러한 메서드를 이용하여 UI를 제작한다.
3.RelativeLayout
|
1
2
3
4
5
6
7
|
<RelativeLayout
android:layout_width=""
android:layout_height=""
android:id="@+id/___"
android:id="@id/___">
</RelativeLayout>
|
cs |
RelativeLayout의 특징은 방향성을 가지지 않으면서
위치를 표시할 때 위치 값을 상대적으로 조정하여 원하는 자리로 배치할 수 있다는 점입니다.
예시의 id객체 중 @+id의 경우에는 요소에 id를 생성하여 식별자 역할을 합니다.
또 다른 @id의 경우에는 이미 만들어진 id를 참조하는 경우입니다.
사실 저렇게 사용되는 것 이 아니라
|
1
2
3
4
5
6
7
8
9
10
11
12
|
<EditText
android:layout_width="250dp"
android:layout_height="wrap_content"
android:inputType="text"
android:id="@+id/et"
android:layout_toRightOf="@id/txt"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="OK"
android:layout_below="@id/et"
android:layout_alignRight="@id/et"/>
|
cs |
이런 식으로 사용이 됩니다.
EditText의 id를 et로 지정하였고 Button의 위치를 et오른쪽 라인에 맞추도록 설정한 것의 예시입니다.
여기에서 기본적으로 알고 좋은 속성으로는
below, align, toRightOf가 있으며
below : 참조된 id의 밑
align : 참조된 id의 라인에 맞춰
toRighitOf : 참조된 id의 오른쪽에
입니다.
가장 많이 사용하는 속성들로 RelativeLayout을 편하게 생각되시는 분들은 기억해두세요
개인적으로는 LinearLayout이 가장 많이 사용되게 되었습니다.
