Android Studio — LinearLayout & RelativeLayout 介紹

Wayne Hsu
Feb 25, 2021

--

iOS 寫到有點膩了,想來玩玩看 Android,順便幫自己做個小筆記。

LinearLayout 線性佈局:

我覺得跟 iOS 的 StackView 蠻像的,分為水平 horizontal及垂直 vertical,兩種,Default是水平佈局,可透過 android:orientation=”vertical” 修改設定。

LinearLayout範例

PS: 不管是horizontal或是vertical,一行或是一列都只會有一個元件。

LinearLayout 進階設定:設定權重的方式來佈局
把對應的height or width 設成 “0dp”,再 android:layout_weight=”1" 設定權重。

只有貼中間的部分

效果如下,可以看到綠色比紅色大,適用於不同大小的螢幕、解析度上。

RelativeLayout 相對佈局:

佈局方式是設定元件的ID,並透過ID來達成相對位置的佈局。

在這種佈局情況下,若該元件都沒有做任何設定的會,通常會預設在畫面的『左上角』,所以可能會有元件重疊的情況發生

現在我們來幫Search Button設定id,並且將它對齊畫面右邊的邊線。

再來新增一個 EditView,設定成對齊畫面左側邊線,且需要在Search_button的左側。

注意:android:id=”@+id/Search_button”android:layout_toLeftOf=”@id/Search_button"的差別,+符號用來設定元件的ID,反之則是相對物件的ID。

參考屬性:

android:id 該屬性指定一個 ID 給元件,並可透過此ID來調用元件。 指定ID需要注意+符號。.android:layout_width 定義元件的寬度,可使用的屬性值有 fill_parent(填滿父視圖)、wrap_content(根據內部內容調整至適當大小)、match_parent(與fill_parent差不多).android:layout_height該屬性定義元件的高度,可使用屬性值同上.android:text該屬性可設定文字顯示在元件上.android:layout_above 將元件置於指定ID元件的上方.android:layout_below 將元件置於指定ID元件的下方.android:layout_toLeftOf 將元件置於指定ID元件的左方.android:layout_toRightOf 將元件置於指定ID元件的右方.android:layout_alignParentTop 將此元件對齊於畫面上邊線,屬性值為true、false.android:layout_alignParentRight 將此元件對齊於畫面右邊線,屬性值為true、false.android:layout_alignParentLeft 將此元件對齊於畫面左邊線,屬性值為true、false.android:layout_alignParentBottom 將此元件對齊於畫面底線,屬性值為true、false.

完整程式碼:

--

--

Wayne Hsu
Wayne Hsu

No responses yet