原文鏈接:http://mp.weixin.QQ.com/s?__biz=MzA5MzI3NjE2MA==&mid=2650238469&idx=1&sn=49154d3b2c0a94c68c27a2b6da0e3759&chksm=88639f6abf14167cbd3e197c6770af73864917322b2b18bcbbf07870667f60951d6ac4bc4d86&mpshare=1&scene=23&srcid=020357JExx0Ck7rTusM1ojQU#rd
本篇文章的主題是ConstraintLayout。其實ConstraintLayout是Android Studio 2.2中主要的新增功能之一,也是Google在去年的I/O大會上重點宣傳的一個功能。我們都知道,在傳統(tǒng)的Android開發(fā)當中,界面基本都是靠編寫xml代碼完成的,雖然Android Studio也支持可視化的方式來編寫界面,但是操作起來并不方便,我也一直都不推薦使用可視化的方式來編寫Android應用程序的界面。
而ConstraintLayout就是為了解決這一現(xiàn)狀而出現(xiàn)的。它和傳統(tǒng)編寫界面的方式恰恰相反,ConstraintLayout非常適合使用可視化的方式來編寫界面,但并不太適合使用XML的方式來進行編寫。當然,可視化操作的背后仍然還是使用的XML代碼來實現(xiàn)的,只不過這些代碼是由Android Studio根據(jù)我們的操作自動生成的。
另外,ConstraintLayout還有一個優(yōu)點,它可以有效地解決布局嵌套過多的問題。我們平時編寫界面,復雜的布局總會伴隨著多層的嵌套,而嵌套越多,程序的性能也就越差。ConstraintLayout則是使用約束的方式來指定各個控件的位置和關系的,它有點類似于RelativeLayout,但遠比RelativeLayout要更強大。
其實ConstraintLayout屬于Android Studio 2.2的新特性,我在去年寫《第二行代碼》的時候就非常想要將這部分內容加入到新書里面,但是在嘗試之后還是放棄了。因為ConstraintLayout的用法很多都是對控件進行拖拽,只用文字或者是一些靜態(tài)圖片實在太難將它的用法表達清楚了,因此不太適合寫到書上。我當時的想法就是后面寫一篇文章來講解ConstraintLayout的用法,彌補一下《第二行代碼》中缺失的這部分新特性,那么今天這篇文章來了。
開始下面我們開始用邊學邊練的方式來進行學習,首先打開你的Android Studio,并新建一個ConstraintLayoutTest項目。另外,確保你的Android Studio是2.2或以上版本。
為了要使用ConstraintLayout,我們需要在app/build.gradle文件中添加ConstraintLayout的依賴,如下所示。
目前ConstraintLayout庫最新的版本是1.0.0-beta4,還沒有推出正式穩(wěn)定版本,不過這并不影響我們提前進行學習和使用。
現(xiàn)在打開res/layout/activity_main.xml文件,由于這是一個新建的空項目,Android Studio會自動幫我們創(chuàng)建好一個布局,如下圖所示。
不過,Android Studio自動創(chuàng)建的這個布局默認使用的是RelativeLayout,我們可以通過如下操作將它轉換成ConstraintLayout。
轉換完成之后,原RelativeLayout中的內容也會自動轉換到ConstraintLayout中,比如圖中的TextView。如果你不需要它的話,可以選中這個控件,然后按鍵盤上的Delete鍵即可刪除。
我們可以看到,現(xiàn)在主操作區(qū)域內有兩個類似于手機屏幕的界面,左邊的是預覽界面,右邊的是藍圖界面。這兩部分都可以用于進行布局編輯工作,區(qū)別是左邊部分主要用于預覽最終的界面效果,右邊部分主要用于觀察界面內各個控件的約束情況。
基本操作下面我們來學習一些具體的操作吧,ConstraintLayout的基本用法很簡單,比如我們想要向布局中添加一個按鈕,那么只需要從左側的Palette區(qū)域拖一個Button進去就可以了,如下圖所示。
雖說現(xiàn)在Button已經(jīng)添加到界面上了,但是由于我們還沒有給Button添加任何的約束,因此Button并不知道自己應該出現(xiàn)在什么位置。現(xiàn)在我們在預覽界面上看到的Button位置并不是它最終運行后的實際位置,如果一個控件沒有添加任何約束的話,它在運行之后會自動位于界面的左上角。
那么下面我們就來給Button添加約束,每個控件的約束都分為垂直和水平兩類,一共可以在四個方向上給控件添加約束,如下圖所示。
上圖中Button的上下左右各有一個圓圈,這圓圈就是用來添加約束的,我們可以將約束添加到ConstraintLayout,也可以將約束添加到另一個控件。比如說,想讓Button位于布局的右下角,就可以這樣添加約束,如下圖所示。
我們給Button的右邊和下邊添加了約束,因此Button就會將自己定位到布局的右下角了。類似地,如果我們想要讓Button居中顯示,那么就需要給它的上下左右都添加約束,如下圖所示。
這就是添加約束最基本的用法了。
除此之外,我們還可以使用約束讓一個控件相對于另一個控件進行定位。比如說,我們希望再添加一個Button,讓它位于第一個Button的正下方,并且間距64dp,那么操作如下所示。
現(xiàn)在添加約束的方式我們已經(jīng)學完了,那么該怎樣刪除約束呢?其實也很簡單,刪除約束的方式一共有三種,第一種用于刪除一個單獨的約束,將鼠標懸浮在某個約束的圓圈上,然后該圓圈會變成紅色,這個時候單擊一下就能刪除了,如下圖所示。
第二種用于刪除某一個控件的所有約束,選中一個控件,然后它的左下角會出現(xiàn)一個刪除約束的圖標,點擊該圖標就能刪除當前控件的所有約束了,如下所示。
第三種用于刪除當前界面中的所有約束,點擊工具欄中的刪除約束圖標即可,如下圖所示。
這樣我們就把ConstraintLayout的基本用法學完了,接下來我們開始學習一些進階的內容。
到這里,我們基本就把ConstraintLayout中的重要用法都概括到了,通過本篇的學習,大家也對ConstraintLayout有了比較深入的認識。當然,ConstraintLayout目前還是處于beta版本,有很多的功能仍然在改進當中。比如說,beta3版本中引入的Chains功能就是一個很強大的新功能,不過由于這個功能需要配合Android Studio 2.3來使用,而2.3目前也還沒有出正式版,因此我就沒在本篇文章中加入這部分內容的介紹。等以后ConstraintLayout的功能更加豐富的時候,我可能會再寫一篇ConstraintLayout的高級用法,來補足這方面的內容吧。
新聞熱點
疑難解答