Android五大布局学习笔记

1，LinearLaout；(常用属性，Weight权重，divider分割线)

1.1，常用属性
    ->orientation：horizontal、vertical；
    ->gravity：控制组件所包含的子元素的对齐方式；
    ->layout_gravity:控制该组件在父容器里的对其方式；
    ->layout_width：通常是wrap_content（组件实际大小）和match_parent（填满父容器）；
    ->layout_height：布局的高度，类比
        layout_width；
    ->id:为该组件设置一个资源id,Java中通过findViewById找到该组件；
    ->background：为该组件设置一个背景图片，或者直接用颜色覆盖。

1.2，Weight，用来等比例的划分区域

    ->等比例划分，分谁，谁为0，Weight按比例即可
    ->[http://labs.udacity.com/android-visualizer/#/android/linear-layout](http://labs.udacity.com/android-visualizer/#/android/linear-layout),XML可视化在线工具；

1.3，divider分割线，用于为LinearLayout设置分割线图片，通过showDividers来设置分割线的所在位置，有四个可选值：none，middle，beginning，end；
    ->divider，为LinearLayout设置分割线的图片；
    ->showDividers，设置分割线所在的位置，四个值可选；
    ->dividerPadding，设置分割线的padding。

布局代码：
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android";
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_weight="1"
android:text="罗路"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:textSize="48sp"
android:paddingTop="40dp"
android:background="#0000"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#000000" />
<TextView
android:layout_weight="1"
android:text="吴佑炫"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="48sp"
android:paddingTop="40dp"
android:gravity="center_horizontal"
android:background="#98FB00"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#000000" />
<TextView
android:layout_weight="1"
android:text="丁俊康"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="48sp"
android:paddingTop="40dp"
android:gravity="center_horizontal"
android:background="#00FB98"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#000000" />
<TextView
android:layout_weight="1"
android:text="赵丹阳"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="48sp"
android:gravity="center_horizontal"
android:paddingTop="40dp"
android:background="#966B98"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#000000" />
<TextView
android:layout_weight="1"
android:text="赵潞"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="48sp"
android:paddingTop="40dp"
android:gravity="center_horizontal"
android:background="#98F532"/>
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#000000" />
</LinearLayout>

46AE47D2-CCD8-4827-AB47-876C3AD0D393.png

2，RelativeLayout，控件之间的相对位置或相对父容器位置进行排列；

2.1，常用属性

      ->子类控件相对子类控件，值是另外一个控件的id；
      ->android:layout_above，位于给定ID控件之上；
      ->android:layout_below；
      ->android:layout_toLeftOf位于给定控件左边；
      ->android:layout_toRightOf;
      ->android:layout_alignLeft，左边与给定ID控件的左边对其；
      ->android:layout_alignRight;
      ->android:layout_alignTop上边与给定ID控件的上边对其；
      ->android:layout_alignBottom;
      ->android:layout_alignBaseLine对齐到控件基准线；
->相对父容器，值是true或false；
      ->android:layout_alignParentLeft，相对于父靠左；
      ->android:layout_alignParentRight;
      ->android:layout_alignParentTop;
      ->android:layout_alignParentBottom;
      ->android:layout_centerInParent=“true”，相对于父，垂直且水平居中；
      ->android:layout_centerHorizontal=“true”；
      ->android:layout_centerVertical=“true”;

->相对父容器位置；
->android:layout_margin=“3dp”
->android:layout_marginLeft
->android:layout_marginRight
->android:layout_marginTop
->android:layout_marginBottom
->4.2以上相对布局的新特性
->android:layout_alignStart，将控件对齐给定的id控件的头部；
->android:layout_alignEnd;
->android:layout_alignParentStart，将控件对齐到父控件的头部；
->android:layout_alignParentEnd；
布局示例代码：
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android";
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="26dp">
<TextView
android:text="我是一"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true" />
<TextView
android:text="我是二"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true" />
<TextView
android:text="我是三"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true" />
<TextView
android:text="我是四"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true" />
</RelativeLayout>

image.png

3，TableLayout，Tablelayout以行和列的形式对控件进行管理，每一行为一个TableRow对象，或一个View控件。当为TableRow对象时，可在TableRow下添加子控件，默认情况下，每个子控件占据一列。有多少个子控件就有多少列;当为View时，该View将独占一行。
3.1，属性
->android:layout_colum，指定该单元格在第几列显示；
->android:layout_span，指定该单元格占据的列数（未指定，默认为1）
->android:stretchColums，设置可伸展的列，该列可向行方向伸展，最多可占据一整行；
->android:shrinkColums，设置可收缩的列，当该列挤满所在行，该子控件的内容将往列方向显示。
计算器示例代码：
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="
http://schemas.android.com/apk/res/android";
xmlns:app="http://schemas.android.com/apk/res-auto";
xmlns:tools="http://schemas.android.com/tools";
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.luolu.alphacaltable.MainActivity">
<TableRow>
<Button android:text="@string/_1"/>
<Button android:text="@string/_2"/>
<Button android:text="@string/_3"/>
<Button android:text="@string/_add"/>
</TableRow>
<TableRow>
<Button android:text="@string/_4"/>
<Button android:text="@string/_5"/>
<Button android:text="@string/_6"/>
<Button android:text="@string/_dec"/>
</TableRow>
<TableRow>
<TableLayout android:layout_span="3">
<TableRow>
<Button android:text="@string/_7"/>
<Button android:text="@string/_8"/>
<Button android:text="@string/_9"/>
</TableRow>
<TableRow>
<Button android:text="=" android:layout_span="2"/>
<Button android:text="0"/>
</TableRow>
</TableLayout>
<Button android:text="*" android:layout_height="match_parent"/>
</TableRow>
</TableLayout>

image.png

4，FrameLayout，这个布局直接在屏幕上开辟出一块空白的区域,当我们往里面添加控件的时候,会默认把他们放到这块区域的左上角,帧布局的大小由控件中最大的子控件决定,如果控件的大小一样大的话,那么同一时刻就只能看到最上面的那个组件!后续添加的控件会覆盖前一个!虽然默认会将控件放置在左上角,但是我们也可以通过layout_gravity属性,指定到其他的位置!
常用属性：
->android:foreground，设置帧布局容器的前景图像；
->android:foregroundGravity，设置前景图像显示的位置。
布局示例代码：
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android";
xmlns:app="http://schemas.android.com/apk/res-auto";
xmlns:tools="http://schemas.android.com/tools";
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.luolu.alphacaltable.MainActivity">
<TextView
android:layout_width="300dp"
android:layout_height="300dp"
android:background="#438bff" />
<TextView
android:layout_width="200dp"
android:layout_height="200dp"
android:background="#7BFE00" />
<TextView
android:layout_width="100dp"
android:layout_height="100dp"
android:background="#ff0015" />
</FrameLayout>

image.png

5，GridLayout，是4.0中引进的新布局控件，支持控件在行、列上都交错排列的情景。优点：1）减少布局嵌套层次从而提高性能；2）适用于需要复杂对齐的布局。
5.1，行列数
->android:rowCount=“8”
->android:columnCount=“8”
5.2，布局方向
->分为水平和垂直两种方式，默认是水平布局
->设置行数或列数之后，控件会自动按行或列进行排列
5.3，单元格属性
->android:layout_column，指定该单元格在第几列显示
->android:layout_row,指定单元格在第几行显示
->android:layout_columnSpan,指定单元格占据的列数
->android:layout_rowSpan，
->android:layout_gravity，指定单元格在容器中的位置
->android:layout_columnWeght，api21加入，列权重
->android:layout_rowWeight，api21加入，行权重
5.4，平均分配行、列问题
->android:layout_columnWeight=“1”
->android:layout_rowWeight=“1”
->占据多行或多列时填满问题
->android:layout_gravity=“fill"

Q：GridLayout 与 GridLayout v7的区别？

主要是解决GridLayout在安卓4.0（API14）以下版本兼容的问题；
1，将此工程拷到你的项目的同级目录下，
(这一点需要注意，很多人导入子工程后，在自己项目add library时不能成功，显示x号，就是这个原因)
2，将gridlayout工程import进来
3，在自己的项目上右键-->属性-->android-->library里gridlayout的子工程
4，xml中的<Gridlayout>标签换成<android.support.v7.widget.GridLayout>，并且添加xmlns:app="http://schemas.android.com/apk/res/自己的工程包名”
5.再然后，在java文件里，import android.support.v7.widget.GridLayout;
6，最后android:minSdkVersion改成低版本的，应用就可以在2.3,2.2上面使用了。

计算器布局文件示例代码：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android";
xmlns:app="http://schemas.android.com/apk/res-auto";
xmlns:tools="http://schemas.android.com/tools";
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.example.luolu.alphacaltable.MainActivity">
<TextView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="0"
android:gravity="center_vertical|end"
android:textSize="50sp"
android:id="@+id/resultText" />
<GridLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="3"
android:id="@+id/tableLayout"
android:rowCount="5"
android:columnCount="4"
>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="C"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="+/-"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="%"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="÷"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="7"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="8"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="9"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="x"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="4"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="5"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="6"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="—"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="1"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="2"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="3"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="+"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="0"
android:layout_columnSpan="2"
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="."
android:textSize="50sp"/>
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:text="="
android:textSize="50sp"/>
</GridLayout>
</LinearLayout>

image.png

人面猴
序言：七十年代末，一起剥皮案震惊了整个滨河市，随后出现的几起案子，更是在滨河造成了极大的恐慌，老刑警刘岩，带你破解...
沈念sama阅读 206,602评论 6赞 481
死咒
序言：滨河连续发生了三起死亡事件，死亡现场离奇诡异，居然都是意外死亡，警方通过查阅死者的电脑和手机，发现死者居然都...
沈念sama阅读 88,442评论 2赞 382
救了他两次的神仙让他今天三更去死
文/潘晓璐我一进店门，熙熙楼的掌柜王于贵愁眉苦脸地迎上来，“玉大人，你说我怎么就摊上这事。” “怎么了？”我有些...
开封第一讲书人阅读 152,878评论 0赞 344
道士缉凶录：失踪的卖姜人
文/不坏的土叔我叫张陵，是天一观的道长。经常有香客问我，道长，这世上最难降的妖魔是什么？我笑而不...
开封第一讲书人阅读 55,306评论 1赞 279
港岛之恋（遗憾婚礼）
正文为了忘掉前任，我火速办了婚礼，结果婚礼上，老公的妹妹穿的比我还像新娘。我一直安慰自己，他们只是感情好，可当我...
茶点故事阅读 64,330评论 5赞 373
恶毒庶女顶嫁案：这布局不是一般人想出来的
文/花漫我一把揭开白布。她就那样静静地躺着，像睡着了一般。火红的嫁衣衬着肌肤如雪。梳的纹丝不乱的头发上，一...
开封第一讲书人阅读 49,071评论 1赞 285
城市分裂传说
那天，我揣着相机与录音，去河边找鬼。笑死，一个胖子当着我的面吹牛，可吹牛的内容都是我干的。我是一名探鬼主播，决...
沈念sama阅读 38,382评论 3赞 400
双鸳鸯连环套：你想象不到人心有多黑
文/苍兰香墨我猛地睁开眼，长吁一口气：“原来是场噩梦啊……” “哼！你这毒妇竟也来了？” 一声冷哼从身侧响起，我...
开封第一讲书人阅读 37,006评论 0赞 259
万荣杀人案实录
序言：老挝万荣一对情侣失踪，失踪者是张志新（化名）和其女友刘颖，没想到半个月后，有当地人在树林里发现了一具尸体，经...
沈念sama阅读 43,512评论 1赞 300
护林员之死
正文独居荒郊野岭守林人离奇死亡，尸身上长有42处带血的脓包…… 初始之章·张勋以下内容为张勋视角年9月15日...
茶点故事阅读 35,965评论 2赞 325
白月光启示录
正文我和宋清朗相恋三年，在试婚纱的时候发现自己被绿了。大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
茶点故事阅读 38,094评论 1赞 333
活死人
序言：一个原本活蹦乱跳的男人离奇死亡，死状恐怖，灵堂内的尸体忽然破棺而出，到底是诈尸还是另有隐情，我是刑警宁泽，带...
沈念sama阅读 33,732评论 4赞 323
日本核电站爆炸内幕
正文年R本政府宣布，位于F岛的核电站，受9级特大地震影响，放射性物质发生泄漏。R本人自食恶果不足惜，却给世界环境...
茶点故事阅读 39,283评论 3赞 307
男人毒药：我在死后第九天来索命
文/蒙蒙一、第九天我趴在偏房一处隐蔽的房顶上张望。院中可真热闹，春花似锦、人声如沸。这庄子的主人今日做“春日...
开封第一讲书人阅读 30,286评论 0赞 19
一桩弑父案，背后竟有这般阴谋
文/苍兰香墨我抬头看了看天上的太阳。三九已至，却和暖如春，着一层夹袄步出监牢的瞬间，已是汗流浃背。一阵脚步声响...
开封第一讲书人阅读 31,512评论 1赞 262
情欲美人皮
我被黑心中介骗来泰国打工，没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留，地道东北人。一个月前我还...
沈念sama阅读 45,536评论 2赞 354
代替公主和亲
正文我出身青楼，却偏偏与公主长得像，于是被迫代替她去往敌国和亲。传闻我的和亲对象是个残疾皇子，可洞房花烛夜当晚...
茶点故事阅读 42,828评论 2赞 345

Android五大布局学习笔记

推荐阅读更多精彩内容