Android開發第三講,佈局管理器
阿新 • • 發佈：2020-08-29
目錄
Android 佈局管理器
一丶簡介佈局管理器
通過上一講,我們用 Android Studio 建立了一個簡單的Android專案.並且成功執行.
我們知道了Android Studio的目錄結構. 也知道我們的 HelloWord是在哪裡存放的.
那麼我們應該這樣想. Android有很多控制元件.等. 類似於MFC 程式.有按鈕啊 編輯框啊等等.
那麼要怎麼進行統一管理的哪. 這裡其實就是Android佈局管理器在管理.
Android Studio -> app ->src ->main -res ->Layout 記錄著的就是HelloWorld檔案存放位置
主要分為兩種
LinearLayout(線性佈局)
RelativeLayout(相對佈局)
下面就介紹下佈局的 xml屬性等
二丶 LinerLayout 線性佈局
2.1 LinerLayout線性佈局的屬性
如下表所示
| 屬性 | 作用 | 對應Value值 | 作用 |
|---|---|---|---|
| android:id | 控制元件的id標識,通過id可以找到控制元件, 有一個@+id 標識自動建立 | @+id/ | 表示自動建立ID.隨便定義一個即可 |
| android:layout_width | 控制元件的寬度,對應值 | wrap_content match_parent | wrap_content,標識根據內容,寬度字修改,match_parent就是匹配父控制元件父控制元件多寬我就多寬 |
| android:layout_height | 高度 | ||
| android:background | 背景 可以設定顏色,圖片.或者自定義的. | ||
| android:layout_margin | 外邊距,表示我這個控制元件距離外部邊距是多少 | ||
| android:layout_padding | 內邊距,距離內部元素的距離是多少.比如你設定20dp那麼內部距離外部就要有20 | padding paddingleft paddingtop paddingbottom | 這裡的padding代表的是上下左右都設定,那麼left就射只設置左邊.反之也有設定上邊 下邊右邊等 |
| android:orientation | 方向,屬於LinerLayout特有的.因為橫著也是線性,豎著也是線性,你也表示你是橫著表示 還是豎著表示 | vertical horizontal | vertical表示線性佈局是垂直方向 horizontal則表示是水平的方向 |
| android:gravity | 表示你內部控制元件的屬性,是居中顯示 還是從左到右 還是上到下等等,注意沒有layout字首 | bottom center | 從下向上 或者居中 |
| android:layout_weight | 權重值 比如我們一個view寬度設定為都設定為1.我們要在一個佈局中一分為2.第一種方法就是建立兩個view,分別設定寬度.第二種就是寬度修改為0,權重值改為1.那麼就代表兩個view的寬度值是平分的,權重值一樣,也可以理解為分別佔了幾分之幾,比如兩個view都是1.那麼就是各佔二分之一,一個是2,一個是1.那麼就是三分之2,另一個就佔了三分之一 |
這些屬性不是說特有的屬於這個佈局的屬性.基本上很多屬性都會用到.所以瞭解了啥意思.
以後編寫xml佈局就很簡單了.
我們可以修改Android Studio看到效果
<?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:id="@+id/m_1"
android:layout_width="200dp"
android:layout_height="200dp"
android:orientation="vertical"
android:paddingTop="30dp"
android:paddingBottom="20dp"
android:paddingLeft="20dp"
android:paddingRight="30dp"
android:background="#cfe2f3">
<!-- view加不加閉合標籤都可以 /> 或者</viwName> -->
<TextView
android:text="HelloWorld"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:background="#cc4125"></TextView>
</LinearLayout>
<!--學習外邊距-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:orientation="horizontal"
android:background="#3c78d8"
android:layout_marginTop="20dp">
<!-- android:gravity="center"> <!– 居中顯示–>-->
<!-- 設定為垂直之後我們的這個LinerLayout就與上面上貼住的.所以設定下外邊距-->
<TextView
android:text="HelloWorld1"
android:layout_height="match_parent"
android:layout_width="0dp"
android:background="#5cb85c"
android:layout_weight="1"></TextView>
<TextView
android:text="HelloWord2"
android:layout_height="match_parent"
android:layout_width="0dp"
android:background="#0000"
android:layout_weight="1"></TextView>
</LinearLayout>
</LinearLayout>
直接使用Android中的 Run即可看到效果
效果圖如下.
三丶相對佈局 RelativeLayout
3.1 相對佈局 RelatvieLayout屬性
| 屬性 | 作用 | 值 | 作用 |
|---|---|---|---|
| android:layout_toLeftOf | 參照的概念,在誰的左邊 填寫一個view的ID 可以相對於這個view設定在它的左邊 | ||
| android:layout_toRightOf | 同上在誰的右邊. | ||
| android:layout_alignBottom | 跟誰底部對齊 | ||
| android:layout_alignParentBottom | 跟父控制元件底部對齊,比如一個view想設定在底部,有兩種方法 1.使用android:gravity 設定為 bottom ,2.在view使用此屬性設定為TRUE | ||
| android:layout_below | 在誰的下邊 | ||
其它網上資料
RelativeLayout用到的一些重要的屬性：
一、相對於父容器而言的屬性
android:layout_centerInparent 相對於父容器完全居中
android:layout_alignParentTop 貼緊父容器的上邊
android:layout_alignParentBottom 貼緊父容器的下邊
android:layout_alignParentLeft 貼緊父容器的左邊
android:layout_alignParentRight 貼緊容器的右邊
二、相對於控制元件而言的屬性
android:layout_below 在某個元件的下邊
android:layout_above 在某個元件的上方
android:layout_toLeftOf 在某個元件的左邊
android:layout_toRightOf 在某元件的右邊
android:layout_alignTop 個元件之間是頂部對齊
android:layout_alignBottom 兩個元件之間是底部對齊
android:layout_alignLeft 兩個元件之間是左邊緣對齊
android:layout_alignRight 兩個元件之間是右邊緣對齊
三、屬性值為具體的畫素值
android:layout_marginTop 離某元素上邊緣的距離
android:layout_marginBottom 離某元素底邊緣的距離
android:layout_marginLeft 離某元素左邊緣的距離
android:layout_marginRight 離某元素右邊緣的距離
Xml 資料如下
<?xml version="1.0" encoding="utf-8"?><!--設定為相對佈局-->
<RelativeLayout 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">
<!-- 設定view1在下面顯示-->
<view
android:id="@+id/View_1"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentBottom="true">
</view>
<!-- 設定view2在右下角顯示-->
<view
android:id="@+id/view_2"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true">
</view>
<!-- 設定view4相對於view3的左邊-->
<view
android:id="@+id/view_3"
android:layout_width="100dp"
android:layout_height="100dp">
</view>
<view
android:id="@+id/view4"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_toRightOf="@+id/view_3">
</view>
<!-- 設定view5相對於vie3的下方-->
<view
android:id="@+id/view_5"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_below="@+id/view_3">
</view>
<!-- 設定view6相對於view2的左邊,並且也有設定為底部顯示-->
<view
android:id="@+id/view_6"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_alignParentBottom="true"
android:layout_toLeftOf="@+id/view_2">
</view>
<!-- 設定線性佈局,位於view6的上方-->
<LinearLayout
android:id="@+id/Lin_view1"
android:layout_above="@+id/view_6"
android:background="#5cb85c"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="200dp">
</LinearLayout>
<!-- 其它自定義xml佈局-->
<LinearLayout
android:layout_above="@+id/Lin_view1"
android:layout_width="match_parent"
android:layout_height="200dp"
android:orientation="horizontal"
android:padding="15dp"
android:background="#1167f0">
<!-- 設定內邊距為15 那麼外部控制元件距離內部控制元件就有15-->
<view
android:id="@+id/view_7"
android:layout_width="100dp"
android:layout_height="match_parent">
</view>
<view
android:layout_marginLeft="10dp"
android:layout_width="100dp"
android:layout_height="match_parent">
</view>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffff00"
android:layout_marginLeft="10dp"
android:padding="10dp">
<view
android:layout_width="120dp"
android:layout_height="120dp"
android:background="#d41f1f">
</view>
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
實現效果