教育行業(yè)A股IPO第一股（股票代碼 003032）

全國咨詢/投訴熱線：400-618-4000

Android培訓實戰(zhàn)教程之提高UI流暢度

更新時間:2015年12月28日15時05分 來源:傳智播客Android培訓學院 瀏覽次數:

Android中所有的界面繪制工作都是在UI線程中進行的，提高UI流暢度的最核心根本在于釋放UI線程。即:不在主線程中做耗時的操作。
 
很多人都知道，耗時的操作要放到子線程中去做，比如訪問網絡，比如讀寫sd卡。像這類操作大家都會很自然的想到使用子線程來完成耗時的操作，等操作結束之后，再通過Handler通知主線程進行界面的更新。這是非常正確的方法。但是有一類方法，它必須得運行在在UI線程中，就是布局文件的加載。如果這類方法花的時間太多了，也是會對流暢度產生很大的影響。今天我們就來講講布局文件的優(yōu)化。
 
加載布局文件，是必須在UI線程中完成的。我們通常是在onCreate方法中直調用setContentView，傳入一個布局文件的id值，或者是通過LayoutInflater來將某一個布局文件轉化成View對象。其實這兩種方式的本質都是一樣的，都是將xml文件轉換成View對象。
我們現在要做的事，就是如何讓xml文件轉換成View對象所花的時間最少。做到了這點，就可以很大程度的提高UI的流暢度。

1、優(yōu)化布局, 減少布局的嵌套層級

   a、使用drawableXXX屬性

  
   如果要實現這樣一個效果，布局文件可以這樣寫
<LinearLayout  orientation="vertical">
     <ImageView/>
      <TextView/>
</LinearLayout>
   優(yōu)化后：
<TextView  drawableBottom="@drawable/contact"/> 
   直接一個TextView就搞定，不需要在外面多一層LinearLayout

   b、多使用RelativeLayout，少使用LinearLayout

如果這樣的布局使用LinearLayout來做的話，那么會是以下這個效果 
<LinearLayout orientation="horizontal">
    <ImageView/>
    <LinearLayout orientation="vertical">
        <LinearLayout orientation="horizontal">
            <TextView/>
            <TextView/>
        </LinearLayout>
        <TextView/>
        <LinearLayout orientation="horizontal">
            <TextView/>
            <TextView/>
        </LinearLayout>
    </LinearLayout>
</LinearLayout>
這樣就莫名其妙的多出了好多個LinearLayout.
這樣過多的LinearLayout嵌套LinearLayout，會造成UI加載的非常慢。這樣的布局完全可以使用一個RelativeLayout來完成，里面的子元素根據相對于其他控件的位置即可確定。
嵌套使用LinearLayout很容易會導致視圖層級過深。如果使用layout_weight這個參數不斷的進行嵌套，有可能會讓各個子View付出計算兩次的昂貴代價
優(yōu)化后代碼：
<RelativeLayout>
    <Image id=avatar layout_alignParentLeft=true />
    <TextView id=name layout_alignParentTop=true layout_toRightOf=@id/avatar />
    <TextView id=location layout_alignParentTop=true layout_toRightOf=@id/name />
    <TextView id=desc layout_below=@id/location layout_toRightOf=@id/avatar />
    ....
</RelativeLayout>

  c、使用merge標簽

使用merge標簽也是能夠減少一些布局的層次。merge標簽經常會和include標簽相聯系。
那么什么時候使用merge標簽呢？下面舉例子說明。
<LinearLayout orientation="vertical">
    ......
    <include layout="@layout/include_view_layout"/>
    ......
</LinearLayout>
而include_view_layout.xml 的代碼如下：
<LinearLayout orientation="vertical">
    <Button/>
    <Button/>
</LinearLayout>
我們看到Button的父控件是LinearLayout，而include的父控件也是LinearLayout，這樣子的布局最終的結果是
<LinearLayout orientation="vertical">
    <LinearLayout orientation="vertical">
        <Button/>
        <Button/>
    </LinearLayout>
</LinearLayout>
紅色部分的LinearLayout完全是多余，于是這時候，我們就可以在include_view_layout.xml文件中使用merge標簽了。如下：
<merge>
    <Button/>
    <Button/>
</merge>
這樣，在加載這個include標簽的時候，系統(tǒng)會忽略merge標簽，直接將merge標簽內的元素添加到外層的LinearLayout去了，達到減少層級的效果。

2、延遲加載

         在開發(fā)某些功能時候，有時候需要動態(tài)的根據條件來判斷顯示哪一個View，不顯示哪一個View。一般的做法是將所有的View都寫在布局文件中去，然后根據條件再來設置他們的可見度Visibility為GONE或者VISIBLE。這種做法邏輯簡單，便于理解。但是缺點就是那些不顯示出來的View也占用了內存，消耗了inflate的時間。因為一個View，不論他的Visibility的值是什么，它都會被inflate出來，并占用內存空間。這時候其實就可以用到延遲加載的控件ViewStub了。
     ViewStub是一個非常輕量級的控件，它占的資源非常小。注意，是ViewStub這個對象所占的資源小，但是你可以為ViewStub指定一個布局文件，這個布局文件被inflate的時候占的空間有可能很大。默認的情況下，ViewStub的所指定的布局文件是不被inflate的，只有當你調用了ViewStub的inflate方法時，ViewStub所指向的布局文件才會被inflate。所以ViewStub是一個延遲加載的控件。
<LinearLayout 
    android:orientation="vertical" 
    android:layout_width="fill_parent" 
    android:layout_height="fill_parent" 
    android:gravity="center_horizontal"> 
<ViewStub  
     android:id="@+id/viewstub1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content"   
     android:layout="@layout/viewstub_layout1"/> 
<ViewStub  
     android:id="@+id/viewstub2" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content"  
     android:layout="@layout/viewstub_layout2"/> 
</LinearLayout> 
 
在java代碼中使用
ViewStub stub1 = (ViewStub) findViewById(R.id.viewstub1); 
ViewStub stub2 = (ViewStub) findViewById(R.id.viewstub2); 
if(isLogin()) {
    stub1.inflate();
} else {
    stub2.inflate();
}
這樣就不會有浪費資源空間去加載沒必要的控件了。

３、減少inflate的次數

         這個的典型例子就是ListView的優(yōu)化。我們說ListView的優(yōu)化，實際上說的就是Adapter中getView方法的優(yōu)化，我們來看一個沒有優(yōu)化過的getView方法。
@Override
public View getView(int position, View convertView, ViewGroup parent) {
    MyItem product = list.get(position);
    convertView = getLayoutInflater()
               .inflate(R.layout.item_record, null);
　　TextView tvDate = (TextView) convertView
                .findViewById(R.id.tvDate);
    TextView tvYongtu =  (TextView) convertView
                .findViewById(R.id.tvYongtu);
     TextView tvMoney  = (TextView) convertView
                .findViewById(R.id.tvMoney);
     tvDate.setText(product.detaildate);
     tvYongtu.setText(product.auditmessage);
     tvMoney.setText(product.detailmoney);
     return convertView;
}
我們知道，ListView中的每一個Item被顯示出來都要調用getView方法，這個Item如果滑出屏幕，又滑回來，重新顯示在界面上的時候，又會再次調用getView方法。所以getView是不斷的被調用的。而上面的代碼，只要調用了getView方法，就一定會去inflate一個布局文件，真簡直就是不敢想象的非常耗時的操作。于是，利用系統(tǒng)給我們的緩存convertView進行判斷，可以大大減少inflate的次數。其實，findViewById也是一個很耗時的操作，我們可以利用ViewHolder來減少findViewById的次數。優(yōu)化后的代碼如下：
@Override
public View getView(int position, View convertView, ViewGroup parent) {
    MyItem product = list.get(position);
    ViewHolder holder;
    if (convertView == null) {
        convertView = getLayoutInflater().inflate(
                R.layout.item_record, null);
        holder = new ViewHolder();
        holder.tvDate = (TextView) convertView
                .findViewById(R.id.tvDate);
        holder.tvYongtu = (TextView) convertView
                .findViewById(R.id.tvYongtu);
        holder.tvMoney = (TextView) convertView
                .findViewById(R.id.tvMoney);
        convertView.setTag(holder);
    } else {
        holder = (ViewHolder) convertView.getTag();
    }
    holder.tvDate.setText(product.detaildate);
    holder.tvYongtu.setText(product.auditmessage);
    holder.tvMoney.setText(product.detailmoney);
    return convertView;
}
static class ViewHolder {
    TextView tvDate;
    TextView tvYongtu;
    TextView tvMoney;
}
 
本文版權歸傳智播客Android培訓學院所有，歡迎轉載，轉載請注明作者出處。謝謝！
作者：傳智播客Android培訓學院
首發(fā)：http://oisangadgets.com/android/

0 分享到：
和我們在線交談！