【声明】

欢迎转载，但请保留文章原始出处→_→

文章来源：http://www.cnblogs.com/smyhvae/p/4372222.html

Android常见布局有下面几种：

  • LinearLayout：线性布局。所有的控件都是串在一条线上的。
  • RelativeLayout：相对布局。所有的控件的位置，都是相对于父控件的。
  • FrameLayout：帧布局。FrameLayout布局中的控件都是一层一层的。帧布局每次添加的控件都显示在最上面，最后显示在界面上的是最后添加的一个控件。
  • TableLayout：表格布局。表格布局可以实现的.一般 可以使用 线性布局实现。
  • AbsoluteLayout：绝对布局。已经是废弃的状态，很少用了。

线性布局 LinearLayout 属性详解                                                                                                                                      

 orientation：属性是指定线性布局的排列方向。

  • horizontal 水平。线性布局默认的朝向是水平的。
  • vertical 垂直

例如：

  1. android:orientation="vertical" 

gravity：指定当前控件里面的内容容显示位置。（四大layout中均可使用）

  • left 左边
  • right 右边
  • top 上边
  • bottom 底边

例如：

  1. android:gravity="center"

gravity中的属性可以组合使用。例如：

  1. android:gravity="bottom|right"

layout_gravity：指定当前控件在父元素的位置。（只在 LinearLayout 和 FrameLayout 中有效）

  • left 左边
  • right 右边
  • top 上边
  • bottom 底边
  • center
  • center_horizontal
  • center_vertical

例如：

  1. android:layout_gravity="center"

另外，需要提示的是，对于 LinearLayout :

  • 当 android:orientation="vertical" 时， 只有水平方向的设置才起作用，垂直方向的设置不起作用。即：left，right，center_horizontal 是生效的。（top，bottom，center_vertical 无效）
  • 当 android:orientation="horizontal" 时， 只有垂直方向的设置才起作用，水平方向的设置不起作用。即：top，bottom，center_vertical 是生效的。（left，right，center_horizontal 无效）

layout_weightSum：把线性布局中剩余空间分成N份。

layout_weight：用于分配剩余空间的比例。【重要】

例如，在线性布局中，当空间处于horizontal水平放置时，如果设置两个控件的width属性和layout_weight属性时，就可以平分宽度：

  1. android:layout_width="0dp"
  2. android:layout_weight="1"

visibility：是控制布局是否显示。

  • visible 显示
  • invisible 不显示但占空间
  • gone 隐藏

例如：

  1. android:visibility="gone"

RelativeLayout 相对布局 属性详解                                                                                                                               

一、常用属性：

1、第一类：属性值为true或false

android:layout_centerHrizontal  　　相对于父元素水平居中

android:layout_centerVertical   　　  相对于父元素垂直居中

android:layout_centerInparent         相对于父元素完全居中

android:layout_alignParentBottom 　　      贴紧父元素的下边缘（align：对齐）

android:layout_alignParentLeft   　　　　    贴紧父元素的左边缘

android:layout_alignParentRight       　　   贴紧父元素的右边缘（默认值为false）

android:layout_alignParentTop       　　      贴紧父元素的上边缘

android:layout_alignWithParentIfMissing     如果对应的兄弟元素找不到的话就以父元素做参照物

2、第二类：属性值必须为id的引用名"@id/id-name"

android:layout_below              在某元素的下方

android:layout_above              在某元素的的上方

android:layout_toLeftOf   　　  在某元素的左边

android:layout_toRightOf  　　 在某元素的右边

android:layout_alignTop    　　本元素的上边缘和某元素的的上边缘对齐

android:layout_alignLeft   　　  本元素的左边缘和某元素的的左边缘对齐

android:layout_alignBottom 　 本元素的下边缘和某元素的的下边缘对齐

android:layout_alignRight  　　本元素的右边缘和某元素的的右边缘对齐

3、第三类：属性值为具体的像素值，如30dp（外边距和内边距）

android:layout_margin 　　        外边距（margin：边缘）

android:layout_marginTop           上外边距

android:layout_marginBottom      下外边距

android:layout_marginLeft           左外边距

android:layout_marginRight         右外边距

android:padding 　　　　　　　　 内边距（padding：填充）

android:paddingTop 　　　　　　  上内边距

android:paddingBottom 　　　　  下内边距

android:paddingLeft  　　　　　　 左内边距

android:paddingRight       　　     右内边距

4、第四类：android4.2新增属性 

android:layout_alignStart 　　        两个控件开始对齐

android:layout_alignEnd                 两个控件结束对齐

android:layout_alignParentStart      子控件和父控件开始对齐

android:layout_alignParentEnd  　　子控件和父控件结束对齐

注：所有控件，默认处在左上角。

二、外边距和内边距的解释：

来看下面这张图：

例如：当在布局文件中，

将第一个TextView加入如下代码：（注：margin的意思是“边缘”）

  1. android:layout_margin="30dp"

将第二个TextView加入如下代码：（注：padding的意思是“填充”）

  1. android:padding="20dp"

最终效果如下：

 

三、对齐至控件的基准线：

android:layout_alignBaseline      与某元素的基准线对齐

什么是基准线？

基准线：为了保证印刷字母的整齐而划定的线。

上图中的第三条线就是基准线。

完整版代码举例：

  1.  <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  2.      xmlns:tools="http://schemas.android.com/tools"
  3.      android:layout_width="match_parent"
  4.      android:layout_height="match_parent"  >
  5.      <TextView
  6.          android:id="@+id/tv1"
  7.          android:layout_width="wrap_content"
  8.          android:layout_height="wrap_content"
  9.          android:background="#FFE4E1"
  10.          android:textSize="30dp"
  11.          android:text="shengmingyihao" />
  12.  
  13.       <TextView
  14.          android:id="@+id/tv2"
  15.          android:layout_width="wrap_content"
  16.          android:layout_height="wrap_content"
  17.          android:background="#D3D3D3"
  18.          android:layout_toRightOf="@id/firstView"
  19.          android:layout_alignBaseline="@id/tv1"
  20.          android:text="smyhvae" />
  21.  </RelativeLayout>

上方代码的第19行就是将tv2对齐至tv1的基准线。

显示效果如下：

上图中绿色的虚线即为基准线。

三、其他属性：

1、EditText控件：

android:hint　　 设置EditText为空时输入框内的提示信息。

2、android:gravity

android:gravity　　该属性是对该view里面的内容的限定。比如一个button里面的text，你可以设置该text在view的靠左、靠右等位置。

以button为例：

　　android:gravity="right"    　　可以让button里面的文字靠右

　　android:gravity="top" 　　     可以让编辑框EditText的光标置于左上方

3、android:gravity和android:layout_gravity区别：

  • gravity    控制当前控件里面的内容显示区域
  • 线性布局中的layout_gravity   当前控件在父元素的位置

比如弄个最外布局，然后里面包了几个布局，如果要使这几个布局都靠底，就可以在最外布局的属性里设置androi:gravity="botton"  因为gravity是对里面的内容起作用。

TableLayout 表格布局属性详解

TableLayout 表格布局：

android:shrinkColumns　　   收缩列

android:stretchColumns       拉伸列

android:collapseColumns     隐藏列

android:layout_column　　  指定列(作用在列的身上)

android:layout_span           合并列(作用在列的身上)

注：TableRow为一行，这个单元行里的单元格的宽度小于默认的宽度时就不起作用,其默认是fill_parent，高度可以自定义大小。

其实，表格布局可以实现的，线性布局也可以实现。

代码举例：   

1、线性布局的代码举例：（小米计算器界面）

要实现的效果如下：

对应的xml文件的代码如下：

  1. <?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.     <EditText
  8.         android:gravity="right"
  9.         android:hint="0"
  10.         android:textColorHint="#000000"
  11.         android:layout_height="wrap_content"
  12.         android:layout_width="fill_parent"/>
  13.  
  14.     <LinearLayout
  15.         android:layout_width="fill_parent"
  16.         android:layout_height="wrap_content"
  17.         android:orientation="horizontal">
  18.  
  19.         <Button
  20.             android:layout_width="0dip"
  21.             android:layout_height="wrap_content"
  22.             android:layout_weight="1"
  23.             android:text="C"
  24.             android:textColor="#F07D22" />
  25.  
  26.         <Button
  27.             android:layout_width="0dip"
  28.             android:layout_height="wrap_content"
  29.             android:layout_weight="1"
  30.             android:text="DEL" />
  31.  
  32.         <Button
  33.             android:layout_width="0dip"
  34.             android:layout_height="wrap_content"
  35.             android:layout_weight="1"
  36.             android:text="÷" />
  37.  
  38.         <Button
  39.             android:layout_width="0dip"
  40.             android:layout_height="wrap_content"
  41.             android:layout_weight="1"
  42.             android:text="×" />
  43.     </LinearLayout>
  44.  
  45.     <LinearLayout
  46.         android:layout_width="fill_parent"
  47.         android:layout_height="wrap_content" >
  48.  
  49.         <Button
  50.             android:layout_width="0dip"
  51.             android:layout_height="wrap_content"
  52.             android:layout_weight="1"
  53.             android:text="7" />
  54.  
  55.         <Button
  56.             android:layout_width="0dip"
  57.             android:layout_height="wrap_content"
  58.             android:layout_weight="1"
  59.             android:text="8" />
  60.  
  61.         <Button
  62.             android:layout_width="0dip"
  63.             android:layout_height="wrap_content"
  64.             android:layout_weight="1"
  65.             android:text="9" />
  66.  
  67.         <Button
  68.             android:layout_width="0dip"
  69.             android:layout_height="wrap_content"
  70.             android:layout_weight="1"
  71.             android:text="－" />
  72.     </LinearLayout>
  73.  
  74.     <LinearLayout
  75.         android:layout_width="fill_parent"
  76.         android:layout_height="wrap_content" >
  77.  
  78.         <Button
  79.             android:layout_width="0dip"
  80.             android:layout_height="wrap_content"
  81.             android:layout_weight="1"
  82.             android:text="4"
  83.             android:textColor="#F07D22" />
  84.  
  85.         <Button
  86.             android:layout_width="0dip"
  87.             android:layout_height="wrap_content"
  88.             android:layout_weight="1"
  89.             android:text="5" />
  90.  
  91.         <Button
  92.             android:layout_width="0dip"
  93.             android:layout_height="wrap_content"
  94.             android:layout_weight="1"
  95.             android:text="6" />
  96.  
  97.         <Button
  98.             android:layout_width="0dip"
  99.             android:layout_height="wrap_content"
  100.             android:layout_weight="1"
  101.             android:text="＋" />
  102.     </LinearLayout>
  103.  
  104.     <LinearLayout
  105.         android:layout_width="fill_parent"
  106.         android:layout_height="wrap_content" >
  107.  
  108.         <LinearLayout
  109.             android:orientation="vertical"
  110.             android:layout_width="0dip"
  111.             android:layout_height="match_parent"
  112.             android:layout_weight="3" >
  113.  
  114.             <LinearLayout
  115.                 android:layout_width="fill_parent"
  116.                 android:layout_height="wrap_content">
  117.                 <Button
  118.                     android:text="1"
  119.                     android:layout_height="wrap_content"
  120.                     android:layout_width="0dip"
  121.                     android:layout_weight="1"/>
  122.                 <Button
  123.                     android:text="2"
  124.                     android:layout_height="wrap_content"
  125.                     android:layout_width="0dip"
  126.                     android:layout_weight="1"/>
  127.                 <Button
  128.                     android:text="3"
  129.                     android:layout_height="wrap_content"
  130.                     android:layout_width="0dip"
  131.                     android:layout_weight="1"/>
  132.  
  133.             </LinearLayout>
  134.             <LinearLayout
  135.                 android:layout_width="fill_parent"
  136.                 android:layout_height="wrap_content">
  137.                 <Button
  138.                     android:text="0"
  139.                     android:layout_height="wrap_content"
  140.                     android:layout_width="0dip"
  141.                     android:layout_weight="2"/>
  142.                 <Button
  143.                     android:text="."
  144.                     android:layout_height="wrap_content"
  145.                     android:layout_width="0dip"
  146.                     android:layout_weight="1"/>
  147.  
  148.             </LinearLayout>
  149.         </LinearLayout>
  150.  
  151.         <Button
  152.             android:gravity="right|bottom"
  153.             android:textColor="#ffffff"
  154.             android:text="="
  155.             android:paddingRight="15dp"
  156.             android:paddingBottom="15dp"
  157.             android:background="#F07D22"
  158.             android:layout_width="0dip"
  159.             android:layout_height="fill_parent"
  160.             android:layout_weight="1" >
  161.         </Button>
  162.     </LinearLayout>
  163.  
  164. </LinearLayout>

再看一遍效果图：

2、相对布局的代码举例：

要实现的效果如下：

完整版代码实现：

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="match_parent" >
  5.     <Button
  6.         android:id="@+id/center"
  7.         android:layout_centerInParent="true"
  8.         android:text="中间"
  9.         android:layout_width="wrap_content"
  10.         android:layout_height="wrap_content"/>
  11.     <Button
  12.         android:layout_alignLeft="@id/center"
  13.         android:layout_above="@id/center"
  14.         android:text="↑"
  15.         android:layout_width="wrap_content"
  16.         android:layout_height="wrap_content"/>
  17.     <Button
  18.         android:layout_alignLeft="@id/center"
  19.         android:layout_below="@id/center"
  20.         android:text="↓"
  21.         android:layout_width="wrap_content"
  22.         android:layout_height="wrap_content"/>
  23.     <Button
  24.         android:layout_alignBottom="@id/center"
  25.         android:layout_toLeftOf="@id/center"
  26.         android:text="←"
  27.         android:layout_width="wrap_content"
  28.         android:layout_height="wrap_content"/>
  29.     <Button
  30.         android:layout_alignBottom="@id/center"
  31.         android:layout_toRightOf="@id/center"
  32.         android:text="右"
  33.         android:layout_width="wrap_content"
  34.         android:layout_height="wrap_content"/>
  35.     <Button
  36.         android:text="左上角"
  37.         android:layout_width="wrap_content"
  38.         android:layout_height="wrap_content"/>
  39.     <Button
  40.         android:layout_alignParentRight="true"
  41.         android:text="右上角"
  42.         android:layout_width="wrap_content"
  43.         android:layout_height="wrap_content"/>
  44.     <Button
  45.         android:layout_alignParentBottom="true"
  46.         android:text="左下角"
  47.         android:layout_width="wrap_content"
  48.         android:layout_height="wrap_content"/>
  49.     <Button
  50.         android:layout_alignParentRight="true"
  51.         android:layout_alignParentBottom="true"
  52.         android:text="左下角"
  53.         android:layout_width="wrap_content"
  54.         android:layout_height="wrap_content"/>
  55.  
  56. </RelativeLayout>

3、TableLayout 表格布局的代码举例：（表格布局可以实现的，线性布局也可以实现）

要实现的效果如下：

完整的代码实现：

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.              android:layout_width="match_parent"
  4.              android:layout_height="match_parent" >
  5.  
  6.     <ImageView
  7.         android:src="@mipmap/ic_launcher"
  8.         android:layout_width="fill_parent"
  9.         android:layout_height="wrap_content"/>
  10.     <TableRow
  11.         android:layout_width="fill_parent"
  12.         android:layout_height="wrap_content">
  13.  
  14.         <TextView
  15.             android:text="QQ号码"
  16.             android:layout_width="0dip"
  17.             android:layout_weight="1"
  18.             android:layout_height="wrap_content"/>
  19.         <EditText
  20.             android:layout_width="0dip"
  21.             android:layout_weight="3"
  22.             android:layout_height="wrap_content"/>
  23.     </TableRow>
  24.     <TableRow
  25.         android:layout_width="fill_parent"
  26.         android:layout_height="wrap_content">
  27.  
  28.         <TextView
  29.             android:text="QQ号码"
  30.             android:layout_width="0dip"
  31.             android:layout_weight="1"
  32.             android:layout_height="wrap_content"/>
  33.         <EditText
  34.             android:layout_width="0dip"
  35.             android:layout_weight="3"
  36.             android:layout_height="wrap_content"/>
  37.     </TableRow>
  38. </TableLayout>

Android组件---四大布局的属性详解的更多相关文章

  1. Android XML文件布局各个属性详解

    第一常用类:属性值为true或false android:layout_centerHrizontal 水平居中 android:layout_centerVertical 垂直居中 android: ...

  2. Android之drawable state各个属性详解

    android:drawable 放一个drawable资源android:state_pressed 是否按下,如一个按钮触摸或者点击.android:state_focused 是否取得焦点,比如 ...

  3. RelativeLayout相对布局 各个属性详解

    RelativeLayout相对布局 相对布局 RelativeLayout 允许子元素指定它们相对于其父元素或兄弟元素的位置,这是实际布局中最常用的布局方式之一.它灵活性大很多,当然属性也多,操作难 ...

  4. 【转】Android之drawable state各个属性详解

    我们在定义一个drawable的时候可以通过xml定义的drawable对象.它使得一个图片能在不同的状态下显示不同的图案,比如一个Button,它有pressed,focused,或者其它状态,通过 ...

  5. Android笔记-2-TextView的属性详解

    [Android 基础]TextView的属性详解 android:autoLink :设置是否当文本为URL链接/email/电话号码/map时,文本显示为可点击的链接.可选值(none/web / ...

  6. Android零基础入门第80节：Intent 属性详解（下）

    上一期学习了Intent的前三个属性,本期接着学习其余四个属性,以及Android系统常用内置组件的启动. 四.Data和Type属性 Data属性通常用于向Action属性提供操作的数据.Data属 ...

  7. android:exported 属性详解

    属性详解 标签: android 2015-06-11 17:47 27940人阅读 评论(7) 收藏 举报 分类: Android(95) 项目点滴(25) 昨天在用360扫描应用漏洞时,扫描结果, ...

  8. Android中的windowSoftInputMode属性详解

    这篇文章主要介绍了Android中的windowSoftInputMode属性详解,本文对windowSoftInputMode的9个属性做了详细总结,需要的朋友可以参考下     在前面的一篇文章中 ...

  9. Android开发–Intent-filter属性详解

    Android开发–Intent-filter属性详解 2011年05月09日 ⁄ Andriod ⁄ 暂无评论 ⁄ 被围观 1,396 views+ 如果一个 Intent 请求在一片数据上执行一个 ...

随机推荐

  1. Play 可以做的 5 件很酷的事

    Play 可以做的 5 件很酷的事 本章译者:@Playframwork 通过 5 个实例,透视 Play 框架背后的哲学. 绑定 HTTP 参数到 JAVA 方法参数 用 Play 框架,在 Jav ...

  2. ASP.NET本质论第二章应用程序对象学习笔记1

    1.请求的处理参数—上下文对象HttpContext 1) 针对每一次请求,ASP.NET将创建一个处理这次请求所使用的HttpContext对象实例,这个对象实例将用来在ASP.NET服务器的处理过 ...

  3. CSS Hack(转)

    做前端多年,虽然不是经常需要hack,但是我们经常会遇到各浏览器表现不一致的情况.基于此,某些情况我们会极不情愿的使用这个不太友好的方式来达到大家要求的页面表现.我个人是不太推荐使用hack的,要知道 ...

  4. iScroll-js—“smooth scrolling for the web”

    原文地址: http://bigdots.github.io/2015/12/15/iScroll-js%E2%80%94%E2%80%94smooth%20scrolling%20for%20the ...

  5. C++引用笔记

    1.什么是引用: 百度百科里的解释:引用就是某一变量(目标)的一个别名,对引用的操作与对变量直接操作完全一样.用&符号表示 举例: using namespace std; int _tmai ...

  6. 公司outing选项

    Sign up:  2014 Summer Outing   请您从以下三个方案中选择您最感兴趣的一个项目, 如果您不能参加此次summer outing, 请选择"遗憾放弃"- ...

  7. Sharepoint学习笔记—习题系列--70-573习题解析 -(Q107-Q110)

    Question 107You are creating a custom workflow action that will be used in Microsoft SharePoint Desi ...

  8. JSP Model模式

    用JSP开发的Web应用模型可以分为Model1和Model2 对于小型的Web应用,通常可以使用模型1来完成. 模型1可以分为两种方式: 一种是完全使用JSP页面来开发Web应用: 另一种是使用JS ...

  9. C迷途指针

    在计算机编程领域中,迷途指针,或称悬空指针.野指针,指的是不指向任何合法的对象的指针. 当所指向的对象被释放或者收回,但是对该指针没有作任何的修改,以至于该指针仍旧指向已经回收的内存地址,此情况下该指 ...

  10. 【读书笔记】iOS-自动释放池

    一,NSObject类提供了一个autorelease方法: -(id)autorelease; 该方法预先设定了一条将来在某个时间发送的release消息,其返回值是接收消息的对象.retain消息 ...