본문 바로가기

programming/안드로이드 스튜디오

[안드로이드 프로그래밍 예제] 직접 풀어보기 5-2

반응형

1. 문제 안내, 예제 화면


직접 풀어보기 5-2

 리니어레이아웃으로 다음 화면을 구성하는 XML을 작성하라. 단, 레이아웃이 구분되어보이도록 서로 다른 색으로 지정한다.


 HTML을 따로 공부했을 때, 대학과정이 아니어서 그런것인지는 모르겠지만, 레이아웃을 그렇게 깊게 공부하지 않았다. 그래서인지 모바일 프로그래밍을 공부할 때 레이아웃 단원에 조금 집중하기 위해 예제를 풀어보았고 자연스럽게 글을 올리게 되었다.

 

2. 풀이 과정

 

 어찌보면 이번 문제는 리니어레이아웃(LinearLayout)를 얼마나 잘 다룰 수 있는지 확인하는 문제라고 생각한다. 문제를 보면 LinearLayout을 여러번 중첩해서 구현할 수 있는 것을 알 수 있다. 최대 3번까지의 레이아웃을 중첩하여 사용하였고 다음은 코드이다.

 

<?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">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="4"
        android:orientation="horizontal"
        >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="2"
            android:background="#FF0000"
            />

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

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="#000000"
                />

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:background="#FFFF00"
                />

        </LinearLayout>

    </LinearLayout>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="4"
        android:background="#0000FF"
        ></LinearLayout>


</LinearLayout>

 

 이 문제에서 중요한 점은 weight속성을 통해 각 레이아웃의 크기를 조절 할 수 있다는 것이다. 내가 공부하는 서적에는 그렇게 자세한 설명이 있진 않아 조금 더 공부해보니 weight는 크기만을 설정하는 것이 아닌 서로의 비율을 유동적으로 설정할 때도 유용하게 사용되는 문법인 것 같다. 다음은 내 코드의 실행결과이다.


실행결과


 

반응형