深入了解View<一>之Android LayoutInfalter原理分析

簡述

LayoutInfalter主要是用來加載布局。對LayoutInfalter不怎么熟悉的,通常都是在Activity中調用setContentView()方法來完成的。其實setContentView()方法的內部也是使用LayoutInfalter來加載布局的,只不過這部分源碼是Internal的,不太容易查看到。接下來我們剖析一下LayoutInfalter的工作流程。

先來看一下LayoutInfalter的基本用法,首先需要獲取到LayoutInfalter的實例,有倆種方法可以獲取到,第一種寫法如下:

LayoutInflater layoutInflater = LayoutInflater.from(context);

另外一種如下:

LayoutInflater layoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

其實第一種就是第二種的簡單寫法,只是Android給我們做了一下封裝而已。得到了LayoutInfalter的實例之后,就可以調用它的inflater()方法來加載布局了,如下所示:

layoutInflater.inflate(resourceId, root);

inflate方法一般接收倆個參數,第一個參數就是要加載的布局,第二個參數是指給該布局的外部再嵌套一層父布局,如果不需要就直接傳null。這樣就成功創建了一個布局的實例,之后再將它添加到指定位置就可以顯示出來了。

下面我們通過一個簡單的例子來更好的理解一下LayoutInfalter的用法。新建一個項目,其中MainActivity對應的布局文件叫做activity_main.xml,代碼如下所示:

這個布局非常簡單,只有一個空的LinearLayout,里面什么都沒有,因此界面上不會顯示任何東西。

接下來我們在定義一個布局文件,給它取名為button_layout.xml,代碼如下所示:

這個布局文件也非常簡單,只有一個button按鈕。現在我們要想辦法,如何通過LayoutInfalter來將button_layout.xml這個布局添加到主布局文件的Linearlayout中。根據剛剛介紹的用法,修改MainActivity的中的代碼,如下所示:

publicclassMainActivityextendsActivity {

privateLinearLayout?mainLayout;

@Override

protectedvoidonCreate(Bundle?savedInstanceState)?{

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

mainLayout?=?(LinearLayout)?findViewById(R.id.main_layout);

LayoutInflater?layoutInflater?=?LayoutInflater.from(this);

View?buttonLayout?=?layoutInflater.inflate(R.layout.button_layout,null);

mainLayout.addView(buttonLayout);

}

}

可以看到,這里先是獲取到了LayoutInfalter的實例,然后調用它的inflate()方法來加載button_layout這個布局,最后調用LinearLayout的addView()方法將它添加到LinearLayout中。

現在運行一下程序,結果如下所示:


Button在界面顯示出來了!說明我們確實借助LayoutInfalter成功的將button_layout.xml這個布局添加到Linearlayout當中了。LayoutInfalter技術廣泛應用于需要動態添加View的時候,比如在ScrollView和ListView中,經常可以看到LayoutInfalter的身影。

當然,僅僅介紹了如何使用LayoutInfalter顯然無法滿足大家的求知欲,知其然也要知其所以然,接下來從源碼的角度看一看LayoutInfalter是如何工作的。

不管你使用的是哪兒個inflate方法的重載,最終都會祝轉輾調用到LayoutInfalter的如下代碼:

publicView inflate(XmlPullParser parser, ViewGroup root,booleanattachToRoot) {

synchronized(mConstructorArgs)?{

finalAttributeSet?attrs?=?Xml.asAttributeSet(parser);

mConstructorArgs[0]?=?mContext;

View?result?=?root;

try{

inttype;

while((type?=?parser.next())?!=?XmlPullParser.START_TAG?&&

type?!=?XmlPullParser.END_DOCUMENT)?{

}

if(type?!=?XmlPullParser.START_TAG)?{

thrownewInflateException(parser.getPositionDescription()

+":?No?start?tag?found!");

}

finalString?name?=?parser.getName();

if(TAG_MERGE.equals(name))?{

if(root?==null||?!attachToRoot)?{

thrownewInflateException("merge?can?be?used?only?with?a?valid?"

+"ViewGroup?root?and?attachToRoot=true");

}

rInflate(parser,?root,?attrs);

}else{

View?temp?=?createViewFromTag(name,?attrs);

ViewGroup.LayoutParams?params?=null;

if(root?!=null)?{

params?=?root.generateLayoutParams(attrs);

if(!attachToRoot)?{

temp.setLayoutParams(params);

}

}rInflate(parser,?temp,?attrs);

if(root?!=null&&?attachToRoot)?{

root.addView(temp,?params);

}

if(root?==null||?!attachToRoot)?{

result?=?temp;

}

}

}catch(XmlPullParserException?e)?{

InflateException?ex?=newInflateException(e.getMessage());

ex.initCause(e);

throwex;

}catch(IOException?e)?{

InflateException?ex?=newInflateException(

parser.getPositionDescription()

+":?"+?e.getMessage());

ex.initCause(e);

throwex;

}

returnresult;

}

}

從這里我們就可以清楚地看出,LayoutInflater其實就是使用Android提供的pull解析方式來解析布局文件的。不熟悉pull解析方式的朋友可以網上搜一下,教程很多,我就不細講了,這里我們注意看下第23行,調用了createViewFromTag()這個方法,并把節點名和參數傳了進去。看到這個方法名,我們就應該能猜到,它是用于根據節點名來創建View對象的。確實如此,在createViewFromTag()方法的內部又會去調用createView()方法,然后使用反射的方式創建出View的實例并返回。

當然,這里只是創建出了一個根布局的實例而已,接下來會在第31行調用rInflate()方法來循環遍歷這個根布局下的子元素,代碼如下所示:

privatevoidrInflate(XmlPullParser parser, View parent,finalAttributeSet attrs)

throwsXmlPullParserException,?IOException?{

finalintdepth?=?parser.getDepth();

inttype;

while(((type?=?parser.next())?!=?XmlPullParser.END_TAG?||

parser.getDepth()?>?depth)?&&?type?!=?XmlPullParser.END_DOCUMENT)?{

if(type?!=?XmlPullParser.START_TAG)?{

continue;

}

finalString?name?=?parser.getName();

if(TAG_REQUEST_FOCUS.equals(name))?{

parseRequestFocus(parser,?parent);

}elseif(TAG_INCLUDE.equals(name))?{

if(parser.getDepth()?==0)?{

thrownewInflateException("?cannot?be?the?root?element");

}

parseInclude(parser,?parent,?attrs);

}elseif(TAG_MERGE.equals(name))?{

thrownewInflateException("?must?be?the?root?element");

}else{

finalView?view?=?createViewFromTag(name,?attrs);

finalViewGroup?viewGroup?=?(ViewGroup)?parent;

finalViewGroup.LayoutParams?params?=?viewGroup.generateLayoutParams(attrs);

rInflate(parser,?view,?attrs);

viewGroup.addView(view,?params);

}

}

parent.onFinishInflate();

}

可以看到,在第21行同樣是createViewFromTag()方法來創建View的實例,然后還會在第24行遞歸調用rInflate()方法來查找這個View下的子元素,每次遞歸完成后則將這個View添加到父布局當中。

這樣的話,把整個布局文件都解析完成后就形成了一個完整的DOM結構,最終會把最頂層的根布局返回,至此inflate()過程全部結束。

比較細心的朋友也許會注意到,inflate()方法還有個接收三個參數的方法重載,結構如下:

inflate(intresource, ViewGroup root,booleanattachToRoot)

那么這第三個參數attachToRoot又是什么意思呢?其實如果你仔細去閱讀上面的源碼應該可以自己分析出答案,這里我先將結論說一下吧,感興趣的朋友可以再閱讀一下源碼,校驗我的結論是否正確。

1. 如果root為null,attachToRoot將失去作用,設置任何值都沒有意義。

2. 如果root不為null,attachToRoot設為true,則會給加載的布局文件的指定一個父布局,即root。

3. 如果root不為null,attachToRoot設為false,則會將布局文件最外層的所有layout屬性進行設置,當該view被添加到父view當中時,這些layout屬性會自動生效。

4. 在不設置attachToRoot參數的情況下,如果root不為null,attachToRoot參數默認為true。

好了,現在對LayoutInflater的工作原理和流程也搞清楚了,你該滿足了吧。額。。。。還嫌這個例子中的按鈕看起來有點小,想要調大一些?那簡單的呀,修改button_layout.xml中的代碼,如下所示:

這里我們將按鈕的寬度改成300dp,高度改成80dp,這樣夠大了吧?現在重新運行一下程序來觀察效果。咦?怎么按鈕還是原來的大小,沒有任何變化!是不是按鈕仍然不夠大,再改大一點呢?還是沒有用!

其實這里不管你將Button的layout_width和layout_height的值修改成多少,都不會有任何效果的,因為這兩個值現在已經完全失去了作用。平時我們經常使用layout_width和layout_height來設置View的大小,并且一直都能正常工作,就好像這兩個屬性確實是用于設置View的大小的。而實際上則不然,它們其實是用于設置View在布局中的大小的,也就是說,首先View必須存在于一個布局中,之后如果將layout_width設置成match_parent表示讓View的寬度填充滿布局,如果設置成wrap_content表示讓View的寬度剛好可以包含其內容,如果設置成具體的數值則View的寬度會變成相應的數值。這也是為什么這兩個屬性叫作layout_width和layout_height,而不是width和height。

再來看一下我們的button_layout.xml吧,很明顯Button這個控件目前不存在于任何布局當中,所以layout_width和layout_height這兩個屬性理所當然沒有任何作用。那么怎樣修改才能讓按鈕的大小改變呢?解決方法其實有很多種,最簡單的方式就是在Button的外面再嵌套一層布局,如下所示:

可以看到,這里我們又加入了一個RelativeLayout,此時的Button存在與RelativeLayout之中,layout_width和layout_height屬性也就有作用了。當然,處于最外層的RelativeLayout,它的layout_width和layout_height則會失去作用。現在重新運行一下程序,結果如下圖所示:


OK!按鈕的終于可以變大了,這下總算是滿足大家的要求了吧。

看到這里,也許有些朋友心中會有一個巨大的疑惑。不對呀!平時在Activity中指定布局文件的時候,最外層的那個布局是可以指定大小的呀,layout_width和layout_height都是有作用的。確實,這主要是因為,在setContentView()方法中,Android會自動在布局文件的最外層再嵌套一個FrameLayout,所以layout_width和layout_height屬性才會有效果。那么我們來證實一下吧,修改MainActivity中的代碼,如下所示:

publicclassMainActivityextendsActivity {

privateLinearLayout?mainLayout;

@Override

protectedvoidonCreate(Bundle?savedInstanceState)?{

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

mainLayout?=?(LinearLayout)?findViewById(R.id.main_layout);

ViewParent?viewParent?=?mainLayout.getParent();

Log.d("TAG","the?parent?of?mainLayout?is?"+?viewParent);

}

}

可以看到,這里通過findViewById()方法,拿到了activity_main布局中最外層的LinearLayout對象,然后調用它的getParent()方法獲取它的父布局,再通過Log打印出來。現在重新運行一下程序,結果如下圖所示:


非常正確!LinearLayout的父布局確實是一個FrameLayout,而這個FrameLayout就是由系統自動幫我們添加上的。

說到這里,雖然setContentView()方法大家都會用,但實際上Android界面顯示的原理要比我們所看到的東西復雜得多。任何一個Activity中顯示的界面其實主要都由兩部分組成,標題欄和內容布局。標題欄就是在很多界面頂部顯示的那部分內容,比如剛剛我們的那個例子當中就有標題欄,可以在代碼中控制讓它是否顯示。而內容布局就是一個FrameLayout,這個布局的id叫作content,我們調用setContentView()方法時所傳入的布局其實就是放到這個FrameLayout中的,這也是為什么這個方法名叫作setContentView(),而不是叫setView()。

最后再附上一張Activity窗口的組成圖吧,以便于大家更加直觀地理解:


結束,謝謝!

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容