Android在线手册
> Android在线手册 > 【Android 界面效果25】android中include标签的使用

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

     app_title.xml：

 

[xHTML] view plaincopy
 
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout android:id="@+id/titleLayout" android:layout_width="fill_parent" android:layout_height="wrap_content"  
  3.             android:background="@drawable/bt" xmlns:android="Http://schemas.android.com/apk/res/android">  
  4.               
  5.         <TextView android:text="@string/login" android:id="@+id/title" android:textSize="20px" android:textColor="@color/white"  
  6.             android:layout_width="wrap_content" android:layout_centerInParent="true" android:layout_height="wrap_content"/>        
  7.         <Button android:text="返回" android:id="@+id/refresh" android:layout_width="wrap_content" android:layout_height="wrap_content"  
  8.             android:layout_alignParentRight="true" android:focusable="false" android:textColor="@color/white"  
  9.             android:background="@drawable/okbutton" android:layout_marginRight="3px"/>  
  10. </RelativeLayout>  

  

 

 

app_tradelogin.xml:

 

[xhtml] view plaincopy
 
  1. <?xml version="1.0" encoding="utf-8"?>  
  2.   
  3. <!-- android:layout_below与 android:layout_above 是必须设置的，否则界面不规则，不设置android:layout_above本界面没有滑动效果-->  
  4.   
  5. <ScrollView android:layout_below="@+id/titleLayout" android:layout_above="@+id/appbottom" android:layout_width="fill_parent"   
  6.      android:layout_height="fill_parent" android:layout_centerInParent="true" xmlns:android="http://schemas.android.com/apk/res/android">  
  7.   
  8.     <LinearLayout android:id="@+id/theWholeLinearLayout" android:orientation="vertical" android:layout_width="fill_parent"   
  9.         android:layout_height="wrap_content" android:paddingLeft="10px" android:paddingTop="6px" android:paddingRight="10px" >  
  10.         <LinearLayout android:id="@+id/linearLayoutLeft" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content">  
  11.             <TableLayout android:id="@+id/widget43" android:layout_width="fill_parent"  
  12.                 android:layout_height="fill_parent" android:orientation="vertical"  
  13.                 xmlns:android="http://schemas.android.com/apk/res/android" android:stretchColumns="1">  
  14.                 <TableRow >   
  15.                 <!--  引用定义好的TextView样式,如果这里的属性和样式里定义的属性重复，则这里会替换样式里定义的属性-->  
  16.                     <TextView android:id="@+id/traderName" android:text="@string/traderName" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
  17.                     <Spinner android:id="@+id/traderNameS" android:layout_width="fill_parent" android:layout_height="wrap_content">  
  18.                     </Spinner>  
  19.                 </TableRow>  
  20.                       
  21.                 <TableRow>  
  22.                     <TextView android:id="@+id/departName" android:text="@string/departName" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
  23.                     <Spinner android:id="@+id/departNameS" android:layout_width="fill_parent" android:layout_height="wrap_content"/>  
  24.                 </TableRow>  
  25.                   
  26.                 <TableRow >  
  27.                     <TextView android:id="@+id/strComponyName" android:text="@string/accType" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
  28.                     <Spinner android:id="@+id/accTyte" android:layout_width="fill_parent" android:layout_height="wrap_content"/>  
  29.                 </TableRow>  
  30.                   
  31.                 <TableRow >  
  32.                     <TextView android:id="@+id/strUserAcc" android:text="@string/userAcc" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
  33.                     <EditText android:id="@+id/accEditText" android:text="" android:numeric="decimal" style="@style/StyleEditText1" mce_style="@style/StyleEditText1"/>  
  34.                 </TableRow>  
  35.                   
  36.                 <TableRow >  
  37.                     <TextView android:id="@+id/userPwd" android:text="@string/userPWD" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
  38.                     <EditText android:id="@+id/userPwdET" android:text="" android:password="true" style="@style/StyleEditText1" mce_style="@style/StyleEditText1"/>  
  39.                 </TableRow>  
  40.                   
  41.                 <TableRow >  
  42.                     <TextView android:id="@+id/commPwd" android:text="@string/commPWD" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
  43.                     <EditText android:id="@+id/commPwdET" android:text="" android:password="true" style="@style/StyleEditText1" mce_style="@style/StyleEditText1"/>  
  44.                 </TableRow>  
  45.             </TableLayout>  
  46.         </LinearLayout>  
  47.           
  48.         <LinearLayout android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="wrap_content">  
  49.               
  50.                 <LinearLayout android:id="@+id/linearLayoutTab1" android:layout_height="wrap_content"   
  51.                     android:layout_width="fill_parent" android:orientation="horizontal">  
  52.                       
  53.                     <LinearLayout android:id="@+id/linearLayoutTab2" android:layout_height="wrap_content"   
  54.                         android:layout_width="fill_parent" android:orientation="horizontal" android:layout_weight="1">  
  55.                         <CheckBox android:id="@+id/recordAcc"  android:layout_width="wrap_content" android:layout_height="wrap_content"/>  
  56.                         <TextView android:id="@+id/commPwd" android:text="@string/saveUserAcc" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
  57.                     </LinearLayout>     
  58.                     <LinearLayout android:id="@+id/linearLayoutTab2" android:layout_height="wrap_content"   
  59.                         android:layout_width="fill_parent" android:orientation="horizontal" android:layout_weight="1">  
  60.                           
  61.                         <CheckBox android:id="@+id/hideAcc" android:layout_width="wrap_content" android:layout_height="wrap_content"/>  
  62.                         <TextView android:id="@+id/commPwd" android:text="@string/ycUserAcc" style="@style/StyleTextInfo1" mce_style="@style/StyleTextInfo1"/>  
  63.                     </LinearLayout>         
  64.                 </LinearLayout>  
  65.                   
  66.             <LinearLayout android:id="@+id/linearLayoutTab1" android:layout_height="wrap_content"   
  67.                     android:layout_width="fill_parent" android:orientation="horizontal">  
  68.               
  69.                     <LinearLayout android:layout_width="220px" android:layout_height="wrap_content" android:orientation="horizontal"   
  70.                         android:gravity="center">  
  71.                               
  72.                                 <Button android:id="@+id/confirmexch" android:gravity="center" android:layout_width="wrap_content"    
  73.                                     android:layout_height="50px" android:textSize="22dp" android:text="@string/login" android:layout_weight="1"  
  74.                                     android:focusable="false" android:textColor="@color/white" android:background="@drawable/buttonl"/>  
  75.                     </LinearLayout>  
  76.                   
  77.                     <LinearLayout android:id="@+id/linearLayoutTab" android:layout_height="wrap_content"   
  78.                         android:layout_width="fill_parent" android:gravity="center">  
  79.                         <ImageView android:layout_width="wrap_content" android:layout_height="50px" android:id="@+id/myImage"/>  
  80.                     </LinearLayout>  
  81.         </LinearLayout>  
  82.     </LinearLayout>  
  83.     </LinearLayout>  
  84. </ScrollView>  

 

 

app_bottom.xml:

 

[xhtml] view plaincopy
 
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout android:id="@+id/appbottom" android:orientation="vertical" android:layout_width="fill_parent"   
  3.         android:layout_height="wrap_content" android:layout_alignParentBottom="true"  
  4.         xmlns:android="http://schemas.android.com/apk/res/android">  
  5.           
  6.     <LinearLayout android:orientation="horizontal" android:layout_width="fill_parent"   
  7.         android:layout_height="wrap_content" android:background="@drawable/light">  
  8.         <ImageView  android:id="@+id/about" android:layout_width="30px" android:layout_height="wrap_content" android:src="@drawable/ttt"  
  9.                 android:layout_alignParentLeft="true"/>  
  10.         <TextView android:id="@+id/light" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textColor="@color/black"/>  
  11.     </LinearLayout>  
  12.       
  13.     <LinearLayout android:orientation="horizontal" android:layout_width="fill_parent"   
  14.         android:layout_height="wrap_content" android:background="@drawable/mainmenu">  
  15.         <Button android:id="@+id/quotButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
  16.             android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
  17.               
  18.         <Button android:id="@+id/entrustButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
  19.             android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
  20.         <Button android:id="@+id/queryButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
  21.             android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
  22.               
  23.         <Button android:id="@+id/yinZhengButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
  24.             android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
  25.               
  26.         <Button android:id="@+id/recordButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
  27.             android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
  28.               
  29.         <Button android:id="@+id/logoutButton" android:layout_weight="1" android:layout_width="52px" android:layout_height="wrap_content"  
  30.             android:textColor="@color/white" android:text="" android:background="@drawable/button1"/>  
  31.     </LinearLayout>  
  32. </LinearLayout>  

 

 

tradelogin_portrait.xml:

 

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

 

 

效果如下：

 

【Android 界面效果25】android中include标签的使用

 

上一篇：
下一篇：