0101011001010111

kotlin 3-2 Android UI - Layout _Linear Layout 본문

Kotlin/안드로이드_[입문]앱개발

kotlin 3-2 Android UI - Layout _Linear Layout

[진주] 2023. 8. 14. 01:59
728x90
반응형

Linear Layout

Linear Layout은, 

이름 그대로 Linear(선적인, 직선의)하게 배치하는 것이다.   //수평 or 수직 배치

 

 

Linear Layout을 만들고,

옵션에 orientation을 주게 되면,

vertical , horizontal을 줄 수 있다.

 

그래서, 다르게 배치 못한다.

- 세로로 배치하는데, 어떤건 또 가로로 예외를 둔다거나 그렇게 배치하지 못한다.

- 중첩시키지 못한다.

 

▼아래와 같은 형태들은 가능하다.

 

 

 

오직, 가로 또는 세로 한 방향으로만 배치가 가능하다.

 

Linear Layout  >  Layout Weight

Linear Layout은 화면 구성시, 전체 영역 대비 비율을 줄 수 있는데,

예를 들자면, 이렇게 

3:7 비율을 줄수도 있다.

ㄴ 플러터의 flex 같은 개념

 

 

 

 


▼직접해봐야 기억에 남는법 !! 강의자료를 따라해보자 

 

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    tools:context=".MainActivity">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    >
    
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="vertical"
        android:background="@color/black">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button1"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button2"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3"/>
    </LinearLayout>
    
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:orientation="horizontal"
        android:background="@color/white">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3"/>
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3"/>
    </LinearLayout>



</LinearLayout>




</androidx.constraintlayout.widget.ConstraintLayout>

 

 

쓱싹쓱싹 /// 성공적!!

버튼에 weight를 줘도 쭉 늘어난다

 

다만, 여기서 백그라운드에 weight를 주려고 조금 해맸던게, 

무조건 width / height를 값을 줘야했기에, 

찾아보니 높이값을 0dp로 주고 height를 하면 된다 해서 해보았더니 깔끔하게 떨어졌다.

 

 

728x90
반응형