android ui
工具包提供了一些布局管理器，它們使用起來相當容易，而且，大多數的時候，你只需要使用它們最基本的特徵來實現ui。
執著於基本特徵的使用對於建立
ui來說，往往不是最高效的。乙個常見的例子就是濫用
linearlayout
，它將會導致
view
樹中的view
數量激增。
view
——更糟的是，布局管理器——新增到應用程式裡都會帶來一定的消耗：初始化，布局和繪製變得更加緩慢。巢狀布局的花銷尤其「昂貴」，例如，如果你巢狀了一些
linearlayout
，並使用了
weight
引數，這會導致子元素要計算兩次。
讓我們看乙個非常簡單且常見的布局例子：乙個列表項，左邊是乙個圖示，右邊是標題和描述，上方是標題，下方是可選的描述。列表項可能看起來如下圖：
為了清楚地認識
view
之間（乙個
imageview
和兩個textview
）的相對位置，下圖是使用
hierarchyviewer
抓獲的布局剪影：
實現這個布局，直接使用
linearlayout
就可以了。列表項本身是乙個水平的
linearlayout
，裡面有乙個
imageview
和乙個垂直的
linearlayout
，垂直的
linearlayout
裡包含兩個
textview
。以下是這個布局的源**：
如果你將它作為listview
的item
，它能正常工作，但卻是相當浪費的。相同的布局可以使用
relativelayout
進行重寫，相對於每個列表項來說，可以節省乙個
view
，且view
層級上更好，只有一層。使用
relativelayout
也很簡單：
新的實現與老的實現看起來效果完全一致，除了一種情況。每個列表項顯示兩行文字：標題和可選的描述。當某乙個列表項的描述不可獲得時，應用程式可能希望將第二個textview
的visibility
設為gone
。linearlayout
實現版表現得很完美，但
relativelayout
實現版就有點差強人意了：
裡，每個
view
都是和父元素
relativelayout
對齊或是和其它
view
對齊的。例如，我們宣告描述部分是和
relativelayout
的底部對齊，標題位於其上並與
relativelayout
的頂端對齊。當描述
gone
時，relativelayout
不知道怎麼去放置標題的底邊緣。為了解決這個問題，你可以使用乙個非常簡單的布局引數：
layout_alignwithparentifmissing
。這個布林引數告訴
relativelayout
：如果目標物件消失時使用自己的邊緣作為錨點。例如，如果你放置乙個
view
到另乙個
visibiity
屬性設為
gone
的view
的右邊，且設定
alignwithparentifmissing
為true
，relativelayout
就會將其左邊緣作為
view
的對齊錨點。在我們的這個場合，使用
alignwithparentifmissing
的結果是
relativelayout
將標題部分的底部與自己的底部對齊。結果如下所示：
現在，我們的布局表現得很完美了，即使描述部分的
visibility
屬性設為
gone
。更好的是，層級更加簡單，因為我們不再使用
linearlayout
，而且，更加高效了。當我們使用
hierarchyviewer
來比較兩個實現版的時候，事實就更明顯了：
另外，當你使用這麼乙個布局作為
listview
的列表項時，這種差異就更為重要了。希望這個簡單的例子能讓你了解布局，了解如何優化你的ui。
xirihanlin
譯於2010.04.23
高效移動web布局
需求 根據元素個數不同，自動填充 解決 flex布局 基本使用 parent item1 item2 彈性布局，以1 2劃分 移動端一般用的比較多的是混合彈性布局，如下需要固定，文字按比例縮放 混合彈性布局實現方式如下 水平垂直居中 flex布局還可以實現水平垂直居中，並且多次使用 self tab...
網頁布局技巧
布局 在css出現之前使用 對網頁進行布局的，利用了 的無邊框和間距的特性 將 的邊框與單元格間距都設為0 然後再將網頁元素按版面需要進行劃分之後，插入到 的各個單元中。但使用 布局，會大量使用到 的巢狀，並且會在 裡假如大量的如width border cellspacing cellpaddin...
html css布局技巧
一 父元素的寬高的變化子元始終素鋪滿父元素 二 子元素位於父元素正中心 三 子元素垂直居中 四 子元素水平居中 五 固定寬高比盒子，padding bottom的取值是參照width，如果width的值是百分比，那麼參照就是父元素的width值 六 文字多於容器寬度顯示省略號 overflow hi...