大致看了看布局大致有5种(approximately)

1. LinearLayout

2. RelativeLayout

3. FrameLayout

4. TableLayout

5. GridLayout

(貌似还有一个AbosuteLayout)


1.   LinearLayout

常用属性:

orientation 
子控件的排列方式
vertical 或者 horizontal
gravity 
这属性决定其子布局
center   水平垂直都居中
center_vertical 垂直居中
center_horizontal  水平居中
right   子类控件在当前布局的右边
left   子类控件在当前布局的左边
bottom  子类控件在当前布局的底部
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

LinearLayout中注意:

layout_gravity  这个属性是控制当前某一个控件相对于父容器的位置的:(书写在子控件标签内,而不是linearlayout标签内)

layout_gravity调整该布局相对父布局的位置        gravity是调整该布局中子布局的位置(可以再子控件标签内、也可以在layout标签内)

<Button
        android:layout_gravity="bottom"
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button3" />

还有一个注意:layout_weight  额外控件分配

(实际上,linearlayout标签还有一个总额、所有的layout_weight的份额之和:weight_sum)

weightSum  总共分几份  ---它不写的时候,就自动计算

Layout_weight 额外空间分配(权重)

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal"
    android:weightSum="2">

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        android:layout_weight="1"/>

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

</LinearLayout>

如果把两份都给了第一个button,则是

<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button"
        android:layout_weight="2"/>

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

    <Button
        android:id="@+id/button3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

还补充一个:

android:visibility="invisible" 控制布局是否显示

(显示 visible;不显示,但占空间 invisible、隐藏 gone)

(invisible的时候,额外空间要减去去它所占用的空间)


2. RelativeLayout  相对布局

子类控件相对于父容器  或者  子类控件之间

a. 相对于父容器,在子类控件中常用到的属性:

------以alignParent开头

layout_alignParentLeft=”true”  子类在父类容器左边

layout_alignParentTop=”true”  子类在父容器的上边

(当然有右边、下边)

--------以margin开头

layout_marginLeft=”21dp”  距离左边缘21dp

layout_marginTop=”21dp” 距离右边缘21dp

(也有marginRight/marginBottom)

--------以center开头

layout_centerInParent=”true”  水平竖直都居中

layout_centerHorizontal=”true” 水平居中

layout_centerVertical=”true”  竖直居中

试玩一下:

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

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="false"
        android:layout_alignParentBottom="true"
        android:text="Button1" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="26dp"
        android:layout_marginTop="26dp"
        android:text="Button2" />

    <Button
        android:id="@+id/button3"
          android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:text="Button3"
        />

    <Button
        android:id="@+id/button4"
          android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:text="Button4"
        />

</RelativeLayout>

注意:

<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="40dp"
        android:text="Button1" />

相当于

<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="40dp"
        android:layout_marginTop="40dp"
        android:text="Button1" />

当然下面这样写,虽然和上面写法一样,但是没有意义

<Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="40dp"
        android:layout_marginRight="40dp"
        android:layout_marginTop="40dp"
        android:layout_marginBottom="40dp"
        android:text="Button1" />

a. 子类控件相对于子类控件,(在子类控件中)常用到的属性:

---在某控件的上下左右

  • android:layout_toRightOf         在指定控件的右边
  • android:layout_toLeftOf           在指定控件的左边
  • android:layout_above               在指定控件的上边
  • android:layout_below               在指定控件的下边

-----和某控件对齐

  • android:layout_alignBaseline     跟指定控件水平对齐(即同一行)
  • android:layout_alignLeft            跟指定控件左对齐(和指定控件的左边线对齐)
  • android:layout_alignRight         跟指定控件右对齐(和指定控件的右边线对齐)
  • android:layout_alignTop        跟指定控件顶部对齐
  • android:layout_alignBottom      跟指定控件底部对齐

玩一下简单的商品展示:

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

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_toRightOf="@+id/imageView1"
        android:text="产品名称"
        android:textSize="18sp"/>
    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@id/textView1"
        android:layout_below="@+id/textView1"
        android:text="产品说明"
        android:textSize="18sp"/>

</RelativeLayout>

(布局是一件很细心的工作)


3. FrameLayout

帧布局每次添加的控件都显示在最上面,最后显示在界面上的是最后添加的一个控件

(影音媒体播放的时候,上面的按钮)

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

    <Button
        android:layout_width="300dp"
        android:layout_height="300dp"
        android:layout_gravity="center"
        android:background="#ff0000"
        android:text="最底部"
        android:gravity="left"
        android:textColor="#000000"
         />

    <Button
        android:layout_width="150dp"
        android:layout_height="150dp"
        android:background="#0ff0ff"
        android:layout_gravity="center"
        android:gravity="left"
        android:text="中间" />

    <Button
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_gravity="center"
        android:background="#ffffff"
        android:text="顶部" />
</FrameLayout>

当然也可以实现进度条

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

    <ProgressBar
        android:id="@+id/progressBar1"
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"/>
    <TextView
        android:text="80%"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        />

</FrameLayout>

(好了,了解到此为止)


4.TableLayout (表格布局)---貌似用的也比较少

TableLayout以行的方式管理子控件。

每一行为一个TableRow标签,当然也可以是一个View标签

作用在TableLayout布局控件上面的:

  • android:shrinkColumns 收缩列
  • android:stretchColumns 拉伸列
  • android:collapseColumns 隐藏列

-----拉伸stretchColumns

不指定拉伸单元格的时候,效果如下(左);使用拉伸后的效果(右)

代码如下: (注意: 在每一行,即TableRow控件中,每一个控件就表示一个单元格)

-------收缩:

收缩列的效果

代码如下:

隐藏列用法同上面俩

下面都是以索引编号为单位

  • android:layout_column 指定列位置(作用在列的身上)
  • android:layout_span 合并列(作用在列的身上)
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <Button
            android:id="@+id/button1"
            android:layout_column="1"
            android:layout_span="2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button1" />

    </TableRow>

    <TableRow
        android:id="@+id/tableRow2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" >
        <Button
            android:id="@+id/button2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button2" />

        <Button
            android:id="@+id/button3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button3" />

        <Button
            android:id="@+id/button4"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Button" />

    </TableRow>

</TableLayout>

但是这两个属性没有提示,而且用的时候,很多时候,不知道怎么回事儿,弄不出“应该有的结果”,建议不用。

注意<TableRow />默认宽度是 match_parent,高度可以自定义大小

TableRow单元行里的单元格的layout_width小于默认的宽度时就不起作用,


5.GridLayout(网格布局)

这个是4.0新增的布局管理器,类似于HTML的table标签,把容器凤城 rows x columns。

GridLayout标签 常用属性:

alignmentMode        设置该布局管理器采用的对齐模式

columnCount             设置网格列的数量

rowCount                    设置网格行的数量

columnOrderPreserved     是否保留列序号

rowOrderPreserved            是否保留行序号

useDefaultMargins              是否使用默认的页边距

其子控件常用属性:

layout_column   设置该子控件在父容器的第几列

layout_row         设置该子控件在父容器的第几行

layout_columnSpan    设置该子控件横向跨几列

layout_rowSpan          设置该子控件纵向跨几行

layout_gravity              采用何种方式占据该网格的空间

玩一下:

<!--     定义一个跨越4列的文本框 -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_columnSpan="4"
        android:textSize="50sp"
        android:layout_marginLeft="4dp"
        android:layout_marginRight="4dp"
        android:padding="5dp"
        android:layout_gravity="right"
        android:background="#eee"
        android:textColor="#000"
        android:text="0"
        />
    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_columnSpan="4"
        android:text="Clear"
        />
</GridLayout>


以下是很少用的:

AbsoluteLayout(绝对布局)

android:layout_x 指定控件在父布局的x轴坐标

android:layout_y 指定控件在父布局的y轴坐标

(使用绝对定位的适应性会比较差,在屏幕的适配上有缺陷)


小结:好的布局,需要你细心,对于布局的每一个细节都有很好的把握。心细一点儿,耐心一点儿。

layout相关的更多相关文章

  1. On having layout

    英文原文在此:http://www.satzansatz.de/cssd/onhavinglayout.htm 介绍 Internet Explorer 中有很多奇怪的渲染问题可以通过赋予其“layo ...

  2. [Android Tips] 9. framework notification layout font size

    android 4.4 framework notification layout 相关字体大小 * title: notification_title_text_size: 18dp * conte ...

  3. iOS开源库--最全的整理 分类: ios相关 2015-04-08 09:20 486人阅读 评论(0) 收藏

    youtube下载神器:https://github.com/rg3/youtube-dl 我擦咧 vim插件:https://github.com/Valloric/YouCompleteMe vi ...

  4. 源代码解析Android中View的layout布局过程

    Android中的Veiw从内存中到呈如今UI界面上须要依次经历三个阶段:量算 -> 布局 -> 画图,关于View的量算.布局.画图的整体机制可參见博文 < Android中Vie ...

  5. 深入理解Auto Layout 第一弹

    本文转载至 http://zhangbuhuai.com/2015/07/16/beginning-auto-layout-part-1/ By 张不坏 2015-07-16 更新日期:2015-07 ...

  6. 为什么DOM操作很慢

    转自:http://kb.cnblogs.com/page/534571/ 一直都听说DOM很慢,要尽量少的去操作DOM,于是就想进一步去探究下为什么大家都会这样说,在网上学习了一些资料,这边整理出来 ...

  7. css属性的选择对动画性能的影响

    现在手机的占比越来越高,各种酷炫页面层出不穷,这些特效都离不开css动画.说到css动画,主流的情况也就无非这两大类:位移和形变.而我们在写一个动画特效的过程中,如何去提升它的性能呢?当然首先我们需要 ...

  8. 史上最全的常用iOS的第三方框架

    文章来源:http://blog.csdn.net/sky_2016/article/details/45502921 图像: 1.图片浏览控件MWPhotoBrowser       实现了一个照片 ...

  9. CSS浏览器兼容性与解析问题终极归纳

    1.怪异模式问题:漏写DTD声明,Firefox仍然会按照标准模式来解析网页,但在IE中会触发怪异模式.为避免怪异模式给我们带来不必要的麻烦,最好养成书写DTD声明的好习惯. 2.IE6双边距问题:在 ...

随机推荐

  1. 【java】String类和StringBuffer类常用操作

    String类是字符串常量,是不可更改的常量.而StringBuffer是字符串变量,它的对象是可以扩充和修改的.StringBuffer在进行字符串处理时,不生成新的对象,在内存使用上要优于Stri ...

  2. 快速获取Windows系统上的国家和地区信息

    Windows系统上包含了200多个国家和地区的数据,有时候编程需要这些资料.以下代码可以帮助你快速获取这些信息.将Console语句注释掉,可以更快的完成分析. static void Main(s ...

  3. linux系统更改目录和文件的权限总结

    对于属于你的文件,可以按照自己的需要改变其权限位的设置.在改变文件权限位设置之前,要仔细地想一想有哪些用户需要访问你的文件(包括你的目录).可以使用c h m o d命令来改变文件权限位的设置.这一命 ...

  4. mvp(1)简介及它与mvc区别

    注意:它们是软件架构,不是设计模式 左边mvc    右边mvp MVC和MVP的区别? MVP 是从经典的MVC架构演变而来,它们的基本思想有相通的地方:Controller/Presenter负责 ...

  5. H5移动前端完美布局之-margin百分比的使用

    一 ,背景 在移动端页面开发我们经常会遇到一件尴尬的事 我们所开发出来的页面跟设计师所给的页面差别很大 再加上移动设备屏幕的大小不一出来的效果更是参差不齐 然后.... 当然 现实情况没有这么糟糕.. ...

  6. bash/shell 数学计算

    $ echo $((20.0/7)) $ zcalc $ bc <<< 20+5/2 $ bc <<< 'scale=4;20+5/2' $ expr 20 + 5 ...

  7. [HZNUOJ1524]排队买票(DP)

    题目链接:http://acm.hznu.edu.cn/JudgeOnline/problem.php?id=1524 简单分析后可以知道每一个手持两元的小朋友前面,售票员手里至少有一个一元. 假设d ...

  8. JAVA字符串格式化-String.format()的使用 (转载)

    常规类型的格式化 String类的format()方法用于创建格式化的字符串以及连接多个字符串对象.熟悉C语言的同学应该记得C语言的sprintf()方法,两者有类似之处.format()方法有两种重 ...

  9. Linux 查找文件方法

    1) find -name httpd.conf 2) find /etc -name "*repo" 详情查找命令-> http://www.yesky.com/210/1 ...

  10. POJ 2369 Permutations

    傻逼图论. #include<iostream> #include<cstdio> #include<cstring> #include<algorithm& ...