【譯】被遺忘的Android GridLayout

原文鏈接:Android Grid Layout
原文作者:Dmytro Danylyk
譯者:蘑菇君

今天在Medium上看到這篇文章脓匿,感覺寫的不錯。由于訪問Medium需要科學(xué)上網(wǎng)宦赠,并且是英文書寫陪毡,給大家?guī)碇T多不便米母,故在此將其譯成中文。由于本人水平有限毡琉,其中如有紕漏或錯誤之處铁瞒,歡迎指正和交流。
GridLayout這種網(wǎng)格布局容器在某些情形下的確是能幫我們輕松實現(xiàn)想要的布局桅滋,并能減少布局的嵌套慧耍,提高性能,而我們大部分人卻經(jīng)常忽略這種布局丐谋。相信這篇文章能給大家?guī)硪恍﹩l(fā)芍碧。


Android Grid Layout

Android開發(fā)者每天都會問自己的一個問題——該用哪個布局呢?

GridLayout發(fā)布已經(jīng)有一段時間了——New Layout Widgets: Space and GridLayout.号俐。

而在Android開發(fā)的世界里泌豆,GridLayout的地位卻略顯尷尬:

  • 大部分開發(fā)者甚至都不知道這種布局的存在。
  • 一些開發(fā)者了解GridLayout萧落,但由于一些原因不使用這種布局叠蝇。
  • 只有少數(shù)開發(fā)者會花時間去研究GridLayout狞贱,并且經(jīng)常使用它。

我寫這篇文章的目的是因為我認(rèn)為這個布局被大家遺忘了。這對它是不公平的谢床。

為什么我們需要GridLayout?

GridLayout讓我們只用單個的根布局就能輕松地創(chuàng)建網(wǎng)格布局礁鲁。

我能用嵌套的LinearLayout去實現(xiàn)網(wǎng)格布局箍铭!

是的,但是你會面臨布局層級過深而導(dǎo)致的性能問題蜜唾。

我能用RelativeLayout去實現(xiàn)網(wǎng)格布局杂曲!

是的,但是RelativeLayout有一些限制袁余,比如:

  • 無法控制控件沿兩個軸同時對齊擎勘。
  • 由于在RelativeLayout里不支持weight等類似的屬性,所以當(dāng)控件占用的空間比你 預(yù)計的要大時颖榜,控件會溢出屏幕或重疊在一起棚饵。

換句話說,RelativeLayout不夠靈活掩完,適應(yīng)性不夠好噪漾。

示例

讓我們來實現(xiàn)一個簡單的布局,這個布局包含了一張大圖且蓬,兩個小圖標(biāo)和圖標(biāo)旁邊的文本欣硼。

預(yù)覽

RelativeLayout

通過RelativeLayout很容易實現(xiàn)這個布局,關(guān)鍵的屬性就是layout_below恶阴,layout_toRightOflayout_alignTop诈胜。

代碼

第一眼看上去好像一切都很完美豹障。然而,當(dāng)你用不同的文字大小去測試你的布局時耘斩,問題就出現(xiàn)了沼填。

問題 1: 無法控制控件沿兩個軸同時對齊。

單行文本應(yīng)該垂直居中于左側(cè)圖標(biāo)括授,然而RelativeLayout無法滿足這種要求坞笙。

預(yù)覽

問題 2: 控件重疊。

多行文本會造成重疊荚虚,因為文本是通過layout_alignTop屬性與左側(cè)圖標(biāo)對齊的薛夜。

預(yù)覽

GridLayout

在下面的圖中,你可以看得出GridLayout能得到更好的展示結(jié)果:

  • 文本垂直居中于左側(cè)圖標(biāo)版述。
  • 多行文本會把下方的控件擠下去梯澜。
預(yù)覽

那么,這種效果是如何去實現(xiàn)的呢渴析?首先使用GridLayout作為根布局晚伙,其次計算我們需要多少列并設(shè)置android:columnCount屬性,在我們這個例子里俭茧,我們需要兩列咆疗。

當(dāng)你在GridLayout里定義控件時,它們是一個接一個被放置的母债,所以無需顯式地再去定義控件的行和列午磁。

如果你想要拉伸你的控件,讓它占據(jù)多行或者多列毡们,你可以使用layout_columnSpanlayout_rowSpan屬性迅皇。

一定要記得,如果你想要你的控件占據(jù)所有可用的空間衙熔,不要設(shè)置你的控件寬度為match_parent登颓,而是設(shè)置成0dp,并且設(shè)置屬性layout_gravity="fill"红氯。

代碼

結(jié)論

如果我們使用得當(dāng)框咙,GridLayout會給我們帶來很大幫助。它能提供很好的靈活性和性能脖隶。另一方面扁耐,它也需要一些時間去學(xué)習(xí)和掌握暇检,你通常需要花更多的時間去開發(fā)或維護(hù)這個布局产阱。

優(yōu)點:

  • 靈活
  • 單個根布局

缺點:

  • 花費時間去學(xué)習(xí)
  • 更多時間去維護(hù)
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市块仆,隨后出現(xiàn)的幾起案子构蹬,更是在濱河造成了極大的恐慌王暗,老刑警劉巖,帶你破解...
    沈念sama閱讀 218,755評論 6 507
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件庄敛,死亡現(xiàn)場離奇詭異俗壹,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)藻烤,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,305評論 3 395
  • 文/潘曉璐 我一進(jìn)店門绷雏,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人怖亭,你說我怎么就攤上這事涎显。” “怎么了兴猩?”我有些...
    開封第一講書人閱讀 165,138評論 0 355
  • 文/不壞的土叔 我叫張陵期吓,是天一觀的道長。 經(jīng)常有香客問我倾芝,道長讨勤,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,791評論 1 295
  • 正文 為了忘掉前任晨另,我火速辦了婚禮潭千,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘拯刁。我一直安慰自己脊岳,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 67,794評論 6 392
  • 文/花漫 我一把揭開白布垛玻。 她就那樣靜靜地躺著割捅,像睡著了一般。 火紅的嫁衣襯著肌膚如雪帚桩。 梳的紋絲不亂的頭發(fā)上亿驾,一...
    開封第一講書人閱讀 51,631評論 1 305
  • 那天,我揣著相機(jī)與錄音账嚎,去河邊找鬼莫瞬。 笑死,一個胖子當(dāng)著我的面吹牛郭蕉,可吹牛的內(nèi)容都是我干的疼邀。 我是一名探鬼主播,決...
    沈念sama閱讀 40,362評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼召锈,長吁一口氣:“原來是場噩夢啊……” “哼旁振!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,264評論 0 276
  • 序言:老撾萬榮一對情侶失蹤拐袜,失蹤者是張志新(化名)和其女友劉穎吉嚣,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體蹬铺,經(jīng)...
    沈念sama閱讀 45,724評論 1 315
  • 正文 獨居荒郊野嶺守林人離奇死亡尝哆,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,900評論 3 336
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了甜攀。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片秋泄。...
    茶點故事閱讀 40,040評論 1 350
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖规阀,靈堂內(nèi)的尸體忽然破棺而出印衔,到底是詐尸還是另有隱情,我是刑警寧澤姥敛,帶...
    沈念sama閱讀 35,742評論 5 346
  • 正文 年R本政府宣布奸焙,位于F島的核電站,受9級特大地震影響彤敛,放射性物質(zhì)發(fā)生泄漏与帆。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,364評論 3 330
  • 文/蒙蒙 一墨榄、第九天 我趴在偏房一處隱蔽的房頂上張望玄糟。 院中可真熱鬧,春花似錦袄秩、人聲如沸阵翎。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,944評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽郭卫。三九已至,卻和暖如春背稼,著一層夾襖步出監(jiān)牢的瞬間贰军,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,060評論 1 270
  • 我被黑心中介騙來泰國打工蟹肘, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留词疼,地道東北人。 一個月前我還...
    沈念sama閱讀 48,247評論 3 371
  • 正文 我出身青樓帘腹,卻偏偏與公主長得像贰盗,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子阳欲,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,979評論 2 355

推薦閱讀更多精彩內(nèi)容