Android Studio 布局 LinearLayout 教學

這次我們要介紹布局
在Android要排版排的好, 必須對Layout有基礎的認識,
LinearLayout提供垂直跟水平兩種排版,
讓你有效的應用這兩種模式,
將你所需要的元件進行排版。

程式碼

一開始你必須指定要垂直還是水平的布局, 所以要先設定

android:orientation="vertical / horizontal"

可以選擇vertical或者horizontal,

如果你沒有設定的話, 預設就會是水平布局。

這裡就直接設定成horizontal

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:id="@+id/activity_main"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="horizontal">
    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="@android:color/holo_green_dark"

        android:text="Hello World!" />
    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="@color/colorAccent"

        android:text="Hello World!" />
    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="@color/colorPrimary"

        android:text="Hello World!" />

</LinearLayout>

執行畫面

如圖所示, 三個TextView水平排列。


那在改成垂直模式

android:orientation="vertical"

執行畫面

如圖所示，三個textview垂直排列。

當然也可以在垂直布局的LinearLayout內放置一個水平布局的LinearLayout, 

任意的排列組合都可以。

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:id="@+id/activity_main"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical">
    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="@android:color/holo_green_dark"

        android:text="Hello World!" />

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="@color/colorAccent"

        android:text="Hello World!" />

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:background="@color/colorPrimary"

        android:text="Hello World!" />

    <LinearLayout

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:orientation="horizontal">

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:background="@android:color/holo_green_dark"

            android:text="Hello World!" />

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:background="@color/colorAccent"

            android:text="Hello World!" />

        <TextView

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:background="@color/colorPrimary"

            android:text="Hello World!" />

    </LinearLayout>

</LinearLayout>

以前面的垂直布局裡在加入一個水平布局,
就會看到如下圖

執行畫面

以上就是簡單的LinearLayout基本操作了。