首页 > 移动开发 > 浅谈Android布局

浅谈Android布局

今天小编主要简单总结一下在Android中的布局,学习过Android的小伙伴都知道,在安卓中有五大常用的布局,如下图所示:

        

        接着,小编就来详细介绍这几种布局,小编是初学者,还请各位小伙伴多多指教哦。首先,我们来看:

        第一个LinearLayout---线性布局,线性布局是我们在开发Android项目中最常用的的一种布局方式,线性布局的方向有两种,分别是垂直布局和水平布局,当垂直布局时,每一行就只有一个元素,多个元素依次垂直往下;水平布局时,只有一行,每一个元素依次向右排列。我们来看一个具体的例子,代码如下所示:

[html]

  1. <span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:orientation="vertical" >  
  6.       
  7.     <LinearLayout   
  8.         android:layout_width="fill_parent"  
  9.         android:layout_height="fill_parent"  
  10.         android:layout_weight="1"  
  11.         android:orientation="horizontal">  
  12.     <TextView   
  13.         android:text="blue"  
  14.         android:gravity="center_horizontal"  
  15.         android:background="#52C8FA"  
  16.         android:layout_width="wrap_content"  
  17.         android:layout_height="fill_parent"  
  18.         android:layout_weight="1"/>  
  19.     <TextView  
  20.         android:text="yellow"  
  21.         android:gravity="center_horizontal"  
  22.         android:background="#FFFF00"  
  23.         android:layout_width="wrap_content"  
  24.         android:layout_height="fill_parent"   
  25.         android:layout_weight="1"/>  
  26.     <TextView  
  27.         android:text="pink"  
  28.         android:gravity="center_horizontal"  
  29.         android:background="#F60C88"  
  30.         android:layout_width="wrap_content"  
  31.         android:layout_height="fill_parent"  
  32.         android:layout_weight="1"/>  
  33.     <TextView   
  34.         android:text="purple"  
  35.         android:gravity="center_horizontal"  
  36.         android:background="#722694"  
  37.         android:layout_width="wrap_content"  
  38.         android:layout_height="fill_parent"  
  39.         android:layout_weight="1"/>  
  40. </LinearLayout>  
  41.      
  42.      <LinearLayout  
  43.          android:orientation="vertical"  
  44.          android:layout_width="fill_parent"  
  45.          android:layout_height="fill_parent"  
  46.          android:layout_weight="1">  
  47.       
  48.     <TextView  
  49.          android:text="green"  
  50.          android:textSize="15pt"  
  51.          android:background="#39E18A"  
  52.          android:layout_width="fill_parent"  
  53.          android:layout_height="wrap_content"  
  54.          android:layout_weight="1"/>  
  55.      <TextView   
  56.         android:text="pink"   
  57.         android:textSize="15pt"   
  58.         android:background="#F60C88"   
  59.         android:layout_width="fill_parent"   
  60.         android:layout_height="wrap_content"   
  61.         android:layout_weight="1"/>   
  62.         
  63.     <TextView   
  64.         android:text="yellow"   
  65.         android:textSize="15pt"   
  66.         android:background="#FFFF00"   
  67.         android:layout_width="fill_parent"   
  68.         android:layout_height="wrap_content"   
  69.         android:layout_weight="1"/>      
  70.     <TextView   
  71.         android:text="blue"   
  72.         android:textSize="15pt"   
  73.         android:background="#52C8FA"   
  74.         android:layout_width="fill_parent"   
  75.         android:layout_height="wrap_content"   
  76.         android:layout_weight="1" />         
  77.            
  78.      </LinearLayout>  
  79.            
  80. </LinearLayout>  
  81. </span>  

       效果如下图所示:

       

       第二个FrameLayout---帧布局,帧布局是从屏幕的左上角(0,0)坐标开始布局,多个组件层叠排列,第一个添加的组件放到最底层,最后添加到框架中的视图显示在最上面。上一层的会覆盖下一层的控件,代码如下所示:

[html]

  1. <span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>  
  2. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent" >  
  5.       
  6.     <TextView  
  7.         android:layout_width="300dp"   
  8.         android:layout_height="300dp"   
  9.         android:background="#52C8FA"/>  
  10.      <TextView      
  11.         android:layout_width="260dp"     
  12.         android:layout_height="260dp"     
  13.         android:background="#FFFF00"/>   
  14.     <TextView      
  15.         android:layout_width="220dp"     
  16.         android:layout_height="220dp"     
  17.         android:background="#F60C88"/>   
  18. </FrameLayout>  </span>  

        运行效果如下所示:

        

       第三个TableLayout---表格布局,表格布局是一个ViewGroup以表格显示它的子视图(view)元素,即行和列标识一个视图的位置,每一个TableLayout里面有表格行TableRow,TableRow里面可以具体定义每一个元素。每一个布局都有自己适合的方式,这五个布局元素可以相互嵌套应用,代码如下所示:

 

[html]

  1. <span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>  
  2. <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="fill_parent" >  
  5.       
  6.     <TableRow>   
  7.         <Button   
  8.             android:text="等"   
  9.             android:background="#52C8FA"/>   
  10.         <Button   
  11.             android:text="一"   
  12.             android:background="#FFFF00"/>   
  13.         <Button   
  14.             android:text="个"   
  15.             android:background="#F60C88"/>   
  16.     </TableRow>   
  17.     <TableRow>   
  18.         <Button   
  19.             android:text="故"   
  20.             android:background="#722694"/>   
  21.         <Button   
  22.             android:layout_span="2"   
  23.             android:text="事!"   
  24.             android:background="#39E18A"/>   
  25.     </TableRow>   
  26. </TableLayout>     
  27.       
  28. </span>  

       运行效果如下图所示:

       

       第四个RelativeLayout---相对布局,相对布局是按照组件之间的相对位置来布局,比如在某个组件的左边,右边,上面和下面,相对布局可以理解为某一个元素为参照物,来定位的布局方式,具体代码如下所示:

[html]

  1. <span style="font-size:18px;"><?xml version="1.0" encoding="utf-8"?>   
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"   
  3.     android:layout_width="fill_parent"   
  4.     android:layout_height="wrap_content"   
  5.     android:padding="10px"   
  6.     >   
  7.     <TextView      
  8.         android:id="@+id/tev1"   
  9.         android:layout_width="wrap_content"     
  10.         android:layout_height="wrap_content"     
  11.         android:layout_marginBottom="30dp"   
  12.         android:text="请输入口令,会有惊喜哦`(*∩_∩*)′:" />   
  13.     <EditText   
  14.         android:id="@+id/tx1"   
  15.         android:layout_width="match_parent"   
  16.         android:layout_height="wrap_content"   
  17.         android:layout_below="@id/tev1" />   
  18.     <Button   
  19.         android:id="@+id/btn1"   
  20.         android:layout_height="wrap_content"   
  21.         android:layout_width="wrap_content"   
  22.         android:layout_below="@id/tx1"   
  23.         android:layout_alignParentRight="true"   
  24.         android:text="确定"   
  25.         android:background="#FFFF00"/>   
  26.     <Button   
  27.         android:id="@+id/btn2"   
  28.         android:layout_height="wrap_content"   
  29.         android:layout_width="wrap_content"   
  30.         android:layout_below="@id/tx1"   
  31.         android:layout_toLeftOf="@id/btn1"   
  32.         android:layout_marginRight="30dp"   
  33.         android:text="取消"   
  34.         android:background="#FFFF00"/>   
  35. </RelativeLayout> </span>  

       效果如下图所示:

       
第五个AbsoluteLayout---绝对布局, 绝对布局通过指定子组件的确切X,Y坐标来确定组件的位置,在Android2.0 API文档中标明该类已经过期,可以使用FrameLayout或者RelativeLayout来代替,小编就不在进行相关介绍了,有需要的小伙伴可以动动自己可爱的小手,在网络这个大世界里面寻找哦`(*∩_∩*)′!

   


本文固定链接: http://www.devba.com/index.php/archives/6367.html | 开发吧

报歉!评论已关闭.