Android開發(fā) - 掌握ConstraintLayout（一）傳統(tǒng)布局的問題

在傳統(tǒng)的Android開發(fā)中，頁面布局占用了我們很多的開發(fā)時間，而且面對復(fù)雜頁面的時候，傳統(tǒng)的一些布局會顯得非常復(fù)雜，每種布局都有特定的應(yīng)用場景，我們通常需要各種布局結(jié)合起來使用來實現(xiàn)復(fù)雜的頁面。隨著ConstraintLayout的推出，這種現(xiàn)象有了很大的改善，而且它可以實現(xiàn)很多傳統(tǒng)布局難以實現(xiàn)的功能。

本系列我們就一起來學(xué)習(xí)ConstraintLayout的使用，來大幅提高我們的生產(chǎn)力。

傳統(tǒng)布局

在ConstraintLayout退出之前，我們經(jīng)常使用FrameLayout, LinearLayout, RelativeLayout, ***Layout等來布局頁面。這些布局當(dāng)然有其方便的地方，但是其方便地同時也限制了我們的使用場景，在寫一些復(fù)雜頁面的時候就顯得力不從心，我們先做一下簡單地回顧：

• FrameLayout：幀布局。最常用并且簡單的布局，通常用于錯誤頁面的顯示，蒙層的顯示等。
• LinearLayout：線性布局。當(dāng)我們繪制需要順序排列的內(nèi)容時，我們使用使用此布局。
• RelativeLayout：相對布局。相當(dāng)于ConstraintLayout的低級版本。顧名思義，可以各個View之間相對地指定位置進行布局。
• ...

存在的問題

以上布局并不是完美的，比如我們要布局這個頁面：

我們?nèi)绻褂脗鹘y(tǒng)的布局，可能會導(dǎo)致布局的層級多層嵌套：

<RelativeLayout>
    <ImageView/>
    <ImageView/>
    <RelativeLayout>
        <TextView/>
        <LinearLayout>
            <TextView/>
            <RelativeLayout>
                <EditText/>
            </RelativeLayout>
        </LinearLayout>
        ...
    </RelativeLayout>
    ...
</RelativeLayout>

• 布局復(fù)雜
  使用傳統(tǒng)的布局雖然可以實現(xiàn)我們的需求，但是在代碼實現(xiàn)中有非常多的嵌套，而且要結(jié)合許多布局的特性來實現(xiàn)，這樣復(fù)雜的布局讓我們難以維護。

• 效率底下
  當(dāng)布局層級越深的時候，系統(tǒng)的繪制效率越低，當(dāng)子View.invalidate()的時候，也會導(dǎo)致其父View進行重新繪制。
  又比如這些布局中相對靈活的RelativeLayout，它會被測量至少兩次，已確定最終渲染時的位置，也同樣會影響效率。

• 難以創(chuàng)建復(fù)雜動畫
  Android在屬性動畫(ObjectAnimator)推出之前，執(zhí)行動畫的原理其實只是在繪制的時候執(zhí)行，并不是真正的改變了布局，在屬性推出之后，雖然確實可以改變其真實的布局屬性，但是由于布局特性的約束以及各個View之間的約束，創(chuàng)建復(fù)雜的動畫也并非易事。

ConstraintLayout登場！

下面我們進入本系列的主角：ConstraintLayout!

使用ConstraintLayout可以解決以上傳統(tǒng)布局存在的種種問題，而且Android Studio也提供了強大而且簡單易用的編輯器，使用它可以讓我們的開發(fā)效率大大增加。

下一篇我們將介紹它：Android開發(fā) - 使用ConstraintLayout（二）介紹

如有更多疑問，請參考我的其它Android相關(guān)博客：我的博客地址