안드로이드 공부/ LinearLayout

LinearLayout

  • view들을 세로, 혹은 가로의 단일 방향으로 정렬하는 뷰 그룹
  • 필수 속성: android:orientation (vertical/ horizontal)

LinearLayout이 부모인 뷰들에게 추가로 주어지는 속성

📎 android:layout_weight

  • 뷰가 화면에서 얼만큼의 공간을 차지해야 하느냐에 따라 해당 뷰에 '중요도' 값을 할당(default == 0)
  • 부모component가 LinearLayout인 뷰들에게 추가로 주어지는 속성
  • LinearLayout의 orientation이 horizontal이면 해당 뷰의 layout_width를, vertical이면 해당 뷰의 layout_height를 0dp로 만들어준다.
  • ⌨ 예시 코드
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal">

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#3f51b5"
        android:text="100"
        android:textSize="20dp" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#8CB53F"
        android:text="200"
        android:textSize="20dp" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#B53FA9"
        android:text="300"
        android:textSize="20dp" />
    
</LinearLayout>
  • 예시 코드 결과
    • "100":"200":"300"=1:1:1로 공간을 나눠가짐

layout_weight와 weightSum과 같이 사용

  • 부모 layout에 weightSum 속성을 지정하면, 그 값에 따라 공간을 등분한다.
  • ⌨ 예시 코드
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:weightSum="5">

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#3f51b5"
        android:text="100"
        android:textSize="20dp" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="2"
        android:background="#8CB53F"
        android:text="200"
        android:textSize="20dp" />

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:background="#B53FA9"
        android:text="300"
        android:textSize="20dp" />

</LinearLayout>
  • 예시 코드 결과
    • 5등분된 공간을 "100":"200":"300" = 1:2:1로 나눠가짐


📎 android:layout_gravity

  • 뷰의 부모 컨테이너의 공간에서 뷰를 어디에 위치시킬지 정해주는 속성
  • start, center, end, bottom 등의 값 지정
  • ⌨예시 코드
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="안녕하세요"
        android:textSize="20dp"
        android:layout_gravity="end"
        />
</LinearLayout>
  • 예시 코드 결과

비교) android:gravity

  • 뷰 안의 content를 정렬하는 데에 사용한다.
  • 예시)
    자식 component에 layout_gravity속성을 부여하는 것 대신,
    LinearLayout에 gravity 속성을 부여하면, 해당 LinearLayout을 부모로 가지는 component들을 그 gravity값을 기준으로 정렬
  • ❗하지만, layout_gravity와 gravity 속성을 모두 지정해줬을 때는 layout_gravity를 따른다.
  • ⌨ 예시 코드
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="right"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="안녕하세요"
        android:textSize="20dp"
        />
    
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="반갑습니다"
        android:textSize="20dp"
        />
</LinearLayout>
  • 예시 코드 결과

좋은 웹페이지 즐겨찾기