Android零基礎入門第27節:正確使用padding和margin
http://www.cnblogs.com/cqkxzsxy/p/7299147.html
前面兩期我們學習了LinearLayout線性佈局的方向、填充模型、權重和對齊,那麼本期我們來學習LinearLayout線性佈局的內邊距和外邊距。
關於padding和margin,很多同學傻傻分不清,相信通過今天的學習可以正確使用。
一、內邊距padding
預設情況下,元件相互之間是緊緊靠在一起的。但是有時候需要元件各邊之間有一定的內邊距,那就可以通過以下幾個屬性來設定,內邊距的值是具體的尺寸,如5dp。
-
android:padding:為元件的四邊設定相同的內邊距。
-
android:paddingLeft:為元件的左邊設定內邊距。
-
android:paddingRight:為元件的右邊設定內邊距。
-
android:paddingTop:為元件的上邊設定內邊距。
-
android:paddingBottom:為元件的下邊設定內邊距。
內邊距的原理如下圖所示:
接下來通過一個簡單的示例程式來學習android:padding的使用用法。
繼續使用app/main/res/layout/目錄下的activity_main.xml檔案,在其中填充如下程式碼片段:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="padding" android:padding="20dp" android:background="#00ffff"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="normal" android:background="#caa926"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="padding" android:paddingLeft="50dp" android:paddingRight="50dp" android:paddingTop="50dp" android:paddingBottom="50dp" android:background="#00f05f"/> </LinearLayout>
執行程式,可以看到下圖所示介面效果:
二、外邊距margin
通過設定內邊距,只能設定內容相對於元件之間的距離,而元件之間仍然是相鄰挨著的。在實際開發中,有時候需要元件之間有一定的間隔距離,那麼就需要用到外邊距了,可以通過以下幾個屬性來設定。
-
android:layout_margin:本元件離上下左右各元件的外邊距。
-
android:layout_marginStart:本元件離開始的位置的外邊距。
-
android:layout_marginEnd:本元件離結束位置的外邊距。
-
android:layout_marginBottom:本元件離下部元件的外邊距。
-
android:layout_marginTop:本元件離上部元件的外邊距。
-
android:layout_marginLeft:本元件離左部元件的外邊距。
-
android:layout_marginRight:本元件離右部元件的外邊距。
外邊距的原理如下圖所示:
接下來通過一個簡單的示例程式來學習android:layout_margin的使用用法。
將上面的示例程式的佈局檔案修改一下,如下所示:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="margin 20dp" android:layout_margin="20dp" android:background="#00ffff"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="normal" android:background="#caa926"/> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="margin 50dp" android:layout_marginLeft="50dp" android:layout_marginRight="50dp" android:layout_marginTop="50dp" android:layout_marginBottom="50dp" android:background="#00f05f"/> </LinearLayout>
重新執行程式,可以看到下圖所示介面效果:
到此,關於LinearLayout線性佈局的內邊距和外邊距已經學習完成,你都掌握了嗎?padding和margin的區別是什麼?
如果把佈局的內邊距和外邊距放在一張圖中比較會更加直觀,如下圖所示:
也有這種說法:margin代表的是偏移,padding代表的是填充。當然,你也可以根據自己的理解來總結。
今天就先到這裡,如果有問題歡迎留言一起探討,也歡迎加入Android零基礎入門技術討論微信群,共同成長!
此文章版權為微信公眾號分享達人秀(ShareExpert)——鑫鱻所有,若轉載請備註出處,特此宣告!
往期總結分享:
Android零基礎入門第1節:Android的前世今生
Android零基礎入門第2節:Android 系統架構和應用元件那些事
Android零基礎入門第3節:帶你一起來聊一聊Android開發環境
Android零基礎入門第4節:正確安裝和配置JDK, 高富帥養成第一招
Android零基礎入門第5節:善用ADT Bundle, 輕鬆邂逅女神
Android零基礎入門第6節:配置優化SDK Manager, 正式約會女神
Android零基礎入門第7節:搞定Android模擬器,開啟甜蜜之旅
Android零基礎入門第8節:HelloWorld,我的第一趟旅程出發點
Android零基礎入門第9節:Android應用實戰,不懂程式碼也可以開發
Android零基礎入門第10節:開發IDE大升級,終於迎來了Android Studio
Android零基礎入門第11節:簡單幾步帶你飛,執行Android Studio工程
Android零基礎入門第12節:熟悉Android Studio介面,開始裝逼賣萌
Android零基礎入門第13節:Android Studio配置優化,打造開發利器
Android零基礎入門第14節:使用高速Genymotion,跨入火箭時代
Android零基礎入門第15節:掌握Android Studio專案結構,揚帆起航
Android零基礎入門第16節:Android使用者介面開發概述
Android零基礎入門第17節:TextView屬性和方法大全
Android零基礎入門第18節:EditText的屬性和使用方法
Android零基礎入門第19節:Button使用詳解
Android零基礎入門第20節:CheckBox和RadioButton使用大全
Android零基礎入門第21節:ToggleButton和Switch使用大全
Android零基礎入門第22節:ImageView的屬性和方法大全
Android零基礎入門第23節:ImageButton和ZoomButton使用大全
Android零基礎入門第24節:自定義View簡單使用,打造屬於你的控制元件
Android零基礎入門第25節:簡單且最常用的LinearLayout線性佈局
Android零基礎入門第26節:兩種對齊方式,layout_gravity和gravity大不同