viewStub，requestFocus，merge，include

http://blog.csdn.net/wangljgood/article/details/6556175

在一个项目中我们可能会需要用到相同的布局设计，如果都写在一个xml文件中，代码显得很冗余，并且可读性也很差，所以我们可以把相同布局的代码单独写成一个模块，然后用到的时候可以通过<include /> 标签来重用layout代码。

     app_title.xml：

    <?xml version="1.0" encoding="utf-8"?>  
    <RelativeLayout android:id="@+id/titleLayout" android:layout_width="fill_parent" android:layout_height="wrap_content"  
                android:background="@drawable/bt" xmlns:android="http://schemas.android.com/apk/res/android">  
                  
            <TextView android:text="@string/login" android:id="@+id/title" android:textSize="20px" android:textColor="@color/white"  
                android:layout_width="wrap_content" android:layout_centerInParent="true" android:layout_height="wrap_content"/>        
            <Button android:text="返回" android:id="@+id/refresh" android:layout_width="wrap_content" android:layout_height="wrap_content"  
                android:layout_alignParentRight="true" android:focusable="false" android:textColor="@color/white"  
                android:background="@drawable/okbutton" android:layout_marginRight="3px"/>  
    </RelativeLayout>

app_tradelogin.xml:

    <?xml version="1.0" encoding="utf-8"?>  
      
    <!-- android:layout_below与 android:layout_above 是必须设置的，否则界面不规则，不设置android:layout_above本界面没有滑动效果-->  
      
    <ScrollView android:layout_below="@+id/titleLayout" android:layout_above="@+id/appbottom" android:layout_width="fill_parent"   
         android:layout_height="fill_parent" android:layout_centerInParent="true" xmlns:android="http://schemas.android.com/apk/res/android">  
      
        <LinearLayout android:id="@+id/theWholeLinearLayout" android:orientation="vertical" android:layout_width="fill_parent"   
            android:layout_height="wrap_content" android:paddingLeft="10px" android:paddingTop="6px" android:paddingRight="10px" >  
            <LinearLayout android:id="@+id/linearLayoutLeft" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content">  
                <TableLayout android:id="@+id/widget43" android:layout_width="fill_parent"  
                    android:layout_height="fill_parent" android:orientation="vertical"  
                    xmlns:android="http://schemas.android.com/apk/res/android" android:stretchColumns="1">  
                    <TableRow >   
                    <!--  引用定义好的TextView样式,如果这里的属性和样式里定义的属性重复，则这里会替换样式里定义的属性-->  
                        <TextView android:id="@+id/traderName" android:text="@string/traderName" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
                        <Spinner android:id="@+id/traderNameS" android:layout_width="fill_parent" android:layout_height="wrap_content">  
                        </Spinner>  
                    </TableRow>  
                          
                    <TableRow>  
                        <TextView android:id="@+id/departName" android:text="@string/departName" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
                        <Spinner android:id="@+id/departNameS" android:layout_width="fill_parent" android:layout_height="wrap_content"/>  
                    </TableRow>  
                      
                    <TableRow >  
                        <TextView android:id="@+id/strComponyName" android:text="@string/accType" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
                        <Spinner android:id="@+id/accTyte" android:layout_width="fill_parent" android:layout_height="wrap_content"/>  
                    </TableRow>  
                      
                    <TableRow >  
                        <TextView android:id="@+id/strUserAcc" android:text="@string/userAcc" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
                        <EditText android:id="@+id/accEditText" android:text="" android:numeric="decimal" style="@style/StyleEditText1" mce_style="@style/StyleEditText1"/>  
                    </TableRow>  
                      
                    <TableRow >  
                        <TextView android:id="@+id/userPwd" android:text="@string/userPWD" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
                        <EditText android:id="@+id/userPwdET" android:text="" android:password="true" style="@style/StyleEditText1" mce_style="@style/StyleEditText1"/>  
                    </TableRow>  
                      
                    <TableRow >  
                        <TextView android:id="@+id/commPwd" android:text="@string/commPWD" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
                        <EditText android:id="@+id/commPwdET" android:text="" android:password="true" style="@style/StyleEditText1" mce_style="@style/StyleEditText1"/>  
                    </TableRow>  
                </TableLayout>  
            </LinearLayout>  
              
            <LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content">  
                  
                    <LinearLayout android:id="@+id/linearLayoutTab1" android:layout_height="wrap_content"   
                        android:layout_width="fill_parent" android:orientation="horizontal">  
                          
                        <LinearLayout android:id="@+id/linearLayoutTab2" android:layout_height="wrap_content"   
                            android:layout_width="fill_parent" android:orientation="horizontal" android:layout_weight="1">  
                            <CheckBox android:id="@+id/recordAcc"  android:layout_width="wrap_content" android:layout_height="wrap_content"/>  
                            <TextView android:id="@+id/commPwd" android:text="@string/saveUserAcc" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
                        </LinearLayout>     
                        <LinearLayout android:id="@+id/linearLayoutTab2" android:layout_height="wrap_content"   
                            android:layout_width="fill_parent" android:orientation="horizontal" android:layout_weight="1">  
                              
                            <CheckBox android:id="@+id/hideAcc" android:layout_width="wrap_content" android:layout_height="wrap_content"/>  
                            <TextView android:id="@+id/commPwd" android:text="@string/ycUserAcc" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
                        </LinearLayout>         
                    </LinearLayout>  
                      
                <LinearLayout android:id="@+id/linearLayoutTab1" android:layout_height="wrap_content"   
                        android:layout_width="fill_parent" android:orientation="horizontal">  
                  
                        <LinearLayout android:layout_width="220px" android:layout_height="wrap_content" android:orientation="horizontal"   
                            android:gravity="center">  
                                  
                                    <Button android:id="@+id/confirmexch" android:gravity="center" android:layout_width="wrap_content"    
                                        android:layout_height="50px" android:textSize="22dp" android:text="@string/login" android:layout_weight="1"  
                                        android:focusable="false" android:textColor="@color/white" android:background="@drawable/buttonl"/>  
                        </LinearLayout>  
                      
                        <LinearLayout android:id="@+id/linearLayoutTab" android:layout_height="wrap_content"   
                            android:layout_width="fill_parent" android:gravity="center">  
                            <ImageView android:layout_width="wrap_content" android:layout_height="50px" android:id="@+id/myImage"/>  
                        </LinearLayout>  
            </LinearLayout>  
        </LinearLayout>  
        </LinearLayout>  
    </ScrollView>  

  app_bottom.xml:

 

    <?xml version="1.0" encoding="utf-8"?>  
    <LinearLayout android:id="@+id/appbottom" android:orientation="vertical" android:layout_width="fill_parent"   
            android:layout_height="wrap_content" android:layout_alignParentBottom="true"  
            xmlns:android="http://schemas.android.com/apk/res/android">  
              
        <LinearLayout android:orientation="horizontal" android:layout_width="fill_parent"   
            android:layout_height="wrap_content" android:background="@drawable/light">  
            <ImageView  android:id="@+id/about" android:layout_width="30px" android:layout_height="wrap_content" android:src="@drawable/ttt"  
                    android:layout_alignParentLeft="true"/>  
            <TextView android:id="@+id/light" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="@color/black"/>  
        </LinearLayout>  
          
        <LinearLayout android:orientation="horizontal" android:layout_width="fill_parent"   
            android:layout_height="wrap_content" android:background="@drawable/mainmenu">  
            <Button android:id="@+id/quotButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
                android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
                  
            <Button android:id="@+id/entrustButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
                android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
            <Button android:id="@+id/queryButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
                android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
                  
            <Button android:id="@+id/yinZhengButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
                android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
                  
            <Button android:id="@+id/recordButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
                android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
                  
            <Button android:id="@+id/logoutButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
                android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
        </LinearLayout>  
    </LinearLayout>  

tradelogin_portrait.xml:

    <?xml version="1.0" encoding="utf-8"?>  
    <RelativeLayout android:layout_width="fill_parent" android:layout_height="fill_parent" style="@style/StyleLayoutMain" mce_style="@style/StyleLayoutMain"  
        xmlns:android="http://schemas.android.com/apk/res/android">  
          
        <!-- include标签内不能设置RelativeLayout属性，如android:layout_alignParentBottom,因为不起作用 -->  
        <!-- include标签内设置id属性后(android:id)，其引用的布局layout内的id属性就不起作用了，怀疑是其引用的layout外层包裹了一层include标签   
            或者是覆盖了其内的属性id-->  
        <!-- 如果没有include标签，所有布局代码都写在一个xml文件中，界面会显得很冗余，可读性很差。而且界面加载的时候是按照顺序加载的，前面的布局不能  
            调用其后面的布局id。而采用include后，一个include中可以引用其后的include中的布局id属性 -->  
        <include android:id="@id/titleLayout" layout="@layout/app_title" />  
      
        <include layout="@layout/app_tradelogin"/>  
              
        <include layout="@layout/app_bottom"/>  
          
    </RelativeLayout>  

 

效果如下：

 

布局技巧：使用ViewStub

http://www.cnblogs.com/xirihanlin/archive/2010/04/28/1723291.html
Android API 中文（14） —— ViewStub
http://www.cnblogs.com/over140/archive/2010/10/18/1853989.html

多亏了<include />标签，在Android里，很容易就能做到共享和重用UI组件。在Android开发中，很容易就能创建出复杂的UI结构，结果呢，用了很多的View，且其中的一些很少使用。针对这种情况，谢天谢地，Android还为我们提供了一个特别的构件——ViewStub，它可以使你充分享受<include />的好处而不会造成无用View的浪费。

ViewStub是一个看不见的，轻量级的View。它没有尺寸，也不会绘制以及以某种形式参与到布局中来。这意味着ViewStub去inflate以及保留在View层次中的代价是很廉价的。ViewStub最佳的描述称之为“懒惰的include”。ViewStub中引用的布局只在你想添加到UI上时才会显示。

为了使用ViewStub，你所有需要做的是指定android:id特性，便于以后inflate，指定android:layout特性，引用布局文件。ViewStub还允许你使用第三个特性，android:inflatedId，你可以使用它来重写包含的布局文件中的根元素的id。最后，在ViewStub上设定的layout_gravity参数将会应用到包含的布局文件的底部。
这里有个例子：

<ViewStub
  android:id="@+id/stub_import"
  android:inflatedId="@+id/panel_import"
  android:layout="@layout/progress_overlay"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:layout_gravity="bottom" />

当你准备inflate ViewStub时，调用inflate()方法即可。你还可以设定ViewStub的Visibility为VISIBLE或INVISIBLE，也会触发inflate。注意的是，使用inflate()方法能返回布局文件的根View：

((ViewStub) findViewById(R.id.stub_import)).setVisibility(View.VISIBLE);
// or
View importPanel = ((ViewStub) findViewById(R.id.stub_import)).inflate();

有一点需要记住的是：当ViewStub inflate后，这个ViewStub就从View层次中移除了。因此，没有必要保留一个对ViewStub的引用（如在类的字段里）。
ViewStub是快捷编程与高效编程之间的产物。与其手动的inflate View并在运行时添加到View层次上，不如简单的使用ViewStub。它相当“廉价”且易于使用。ViewStub唯一的缺点是现在不支持<merge />标签。

viewStub，requestFocus，merge，include的用法：
http://breaklayer.iteye.com/blog/883745

viewStub，requestFocus，merge，include

定义Android Layout(XML)时，有四个比较特别的标签是非常重要的，其中有三个是与资源复用有关，分别是<viewStub/>, <requestFocus />, <merge /> and<include />。可是以往我们所接触的案例或者官方文档的例子都没有着重去介绍这些标签的重要性。

• <viewStub  />: 此标签可以使UI在特殊情况下，直观效果类似于设置View的不可见性，但是其更大的(R)意义在于被这个标签所包裹的Views在默认状态下不会占用任何内存空间。viewStub通过include从外部导入Views元素。
  • 用法：通过android:layout来指定所包含的内容。默认情况下，ViewStub所包含的标签都属于visibility=GONE。viewStub通过方法inflate()来召唤系统加载其内部的Views。

    <ViewStub android:id="@+id/stub"
    android:inflatedId="@+id/subTree"
    android:layout="@layout/mySubTree"
    android:layout_width="120dip"
    android:layout_height="40dip" />

• <include />:可以通过这个标签直接加载外部的xml到当前结构中，是复用UI资源的常用标签。
  • 用法：将需要复用xml文件路径赋予include标签的Layout属性。

    <include android:id="@+id/cell1" layout="@layout/ar01" />
    <include android:layout_width="fill_parent" layout="@layout/ar02" />

• <requestFocus />: 标签用于指定屏幕内的焦点View。
  • 用法: 将标签置于Views标签内部 <!– Easy AdSenser V2.37 –><!– Post[count: 2] –>

    <EditText id="@+id/text"
                 android:layout_width="fill_parent"
                 android:layout_height="wrap_content"
                 android:layout_weight="0"
                 android:paddingBottom="4">
           <requestFocus />
    </EditText>

• <merge />:

  单独将<merge />标签做个介绍，是因为它在优化UI结构时起到很重要的作用。目的是通过删减多余或者额外的层级，从而优化整个Android Layout的结构。

  将通过一个例子来了解这个标签实际所产生的作用，这样可以更直观的了解<merge/>的用法。

  建立一个简单的Layout，其中包含两个Views元素：ImageView和TextView 默认状态下我们将这两个元素放在FrameLayout中。其效果是在主视图中全屏显示一张图片，之后将标题显示在图片上，并位于视图的下方。以下是xml代码：

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"

        android:scaleType="center"
        android:src="@drawable/golden_gate" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dip"
        android:layout_gravity="center_horizontal|bottom"

        android:padding="12dip"

        android:background="#AA000000"
        android:textColor="#ffffffff"

        android:text="Golden Gate" />

</FrameLayout>

应用上边的Layout运行的视图为：

启动 tools> hierarchyviewer.bat工具查看当前UI结构视图：

我们可以很明显的看到由红色线框所包含的结构出现了两个framelayout节点，很明显这两个完全意义相同的节点造成了资源浪费（这里可以提醒大家在开发工程中可以习惯性的通过hierarchyViewer查看当前UI资源的分配情况），那么如何才能解决这种问题呢（就当前例子是如何去掉多余的frameLayout节点）？这时候就要用到<merge />标签来处理类似的问题了。我们将上边xml代码中的framLayout替换成merge：

<!– Easy AdSenser V2.37 –><!– Post[count: 2] –>

<merge xmlns:android="http://schemas.android.com/apk/res/android">

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"

        android:scaleType="center"
        android:src="@drawable/golden_gate" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="20dip"
        android:layout_gravity="center_horizontal|bottom"

        android:padding="12dip"

        android:background="#AA000000"
        android:textColor="#ffffffff"

        android:text="Golden Gate" />

</merge>

运行程序后在Emulator中显示的效果是一样的，可是通过hierarchyviewer查看的UI结构是有变化的，当初多余的 FrameLayout节点被合并在一起了，或者可以理解为将merge标签中的子集直接加到Activity的FrameLayout跟节点下（这里需要提醒大家注意：所有的Activity视图的根节点都是frameLayout）。如果你所创建的Layout并不是用framLayout作为根节点（而是应用LinerLayout等定义root标签），就不能应用上边的例子通过merge来优化UI结构。

除了上边的例子外，meger还有另外一个用法

当应用Include或者ViewStub标签从外部导入xml结构时，可以将被导入的xml用merge作为根节点表示，这样当被嵌入父级结构中后可以很好的将它所包含的子集融合到父级结构中，而不会出现冗余的节点。

另外有两点需要特别注意：

<merge />只可以作为xml layout的根节点。

当需要扩充的xml layout本身是由merge作为根节点的话，需要将被导入的xml layout置于 viewGroup中，同时需要设置attachToRoot为True。