icode
iqqcode
2022-06-05
目录

线性布局LinearLayout

# 序言

布局和控件之前的关系：

image-20210309155047171

当LinearLayout的排列方向是horizontal时，只有垂直方向上的对齐方式才会生效，因为此时水平方向上的长度是不固定的，每添加一个控件，水平方向上的长度都会改变，因而无法指定该方向上的对齐方式。

同样的道理，当LinearLayout的排列方向是vertical时，只有水平方向上的对齐方式才会生效

在使用时一定要加上orientation，否则在出现id时会报错或者报红

# 线性布局属性

  • android:orientation 方向
  • android:layout_weight 权重
  • android:layout_gravity 重力

# orientation方向

  • vertical(垂直)
  • horizontal(水平)

# layout_weight权重

将布局的宽度或高度平均分成几个等份

垂直方向上占用中间所有空间 或 水平方向上占用中间所有空间

  • layout_weight = 0(默认值）：指定多大空间就占据多大的空间

  • layout_weight > 0：将父视图中的可用空间进行分割，值越大权重就越大，占据的 比例就会越大

  • 文本过长时，文本可能被“挤出去”，但是比例不变

image-20201124105451986

【比例划分】

  • horizontal，lauout_width="0dp"
  • vertical，lauout_hight="0dp"

测试：lauout_width="0dp"才会按权重分配，wrap_content并不会

image-20210315172327893

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="120dp"
        android:gravity="center"
        android:background="#7bed9f"
        android:orientation="horizontal">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="2"
            android:text="按钮1" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="按钮2" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="按钮2" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="horizontal">
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:gravity="center"
        android:background="#ff7f50"
        android:orientation="horizontal">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="2"
            android:text="按钮1" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="按钮2" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="按钮2" />
    </LinearLayout>

</LinearLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66

# gravity

  • center：水平垂直居中
  • center_horizontal：水平居中 ----> 羊肉串
  • center_vertical：垂直居中 ----> 烤鸡
  • bottom & top ：底部 & 顶部
  • left & right ：靠左 & 靠右

android:gravity 用于指定文字/内容在控件中的对齐方式

而android:layout_gravity 用于指定控件在布局中的对齐方式。android:layout_gravity 的可选值和android:gravity 差不多


# layout_gravity重力

重力：表现为往那边靠拢。与orientation方向的选择有关

  • top : 靠上

  • center 、center_vertical、center_horizontal : 水平居中

  • bottom : 底部

  • [x] 如果是vertical，则上下空间固定，可以左右偏移

  • [x] 如果是horizontal，则横向空间固定，可以上下偏移


# gravity VS layout_gravity

  • android:gravity 设置布局内部所有子View
  • android:layout_gravity 设置View的本身
  • android:layout_gravity 属性的设置与父布局的 android:orientation 属性设置有关

# Padding & margin

image-20210315174508507

## 基础属性

# 1.位置属性

以下的属性值为true或者false

Android:layout_alignWithParentIfMissing
 
Android:layout_alignParentEnd         紧贴父元素结束位置结束
 
Android:layout_alignParentStart       紧贴着父元素结束位置开始
 
Android:layout_alignParentBottom      紧贴着父元素的下边缘
 
Android:layout_alignParentLeft        贴紧父元素的左边缘对齐
 
Android:layout_alignParentRight       贴紧父元素的右边缘对齐
 
Android:layout_alignParentTop         贴紧父元素的上边缘对齐
 
Android:layout_alignCenterInParent    相对于父元素完全居中
 
Android:layout_centerHorizontal       水平居中
 
Android:layout_centerVertical         垂直居中
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

# 2.尺寸属性

以下的属性值为具体的像素值，如30dp

Android:layout_margin
 
       Android:layout_marginLeft         
 
       Android:layout_marginRight
 
       Android:layout_marginTop
 
       Android:layout_marginBottom
 
       Android:layout_marginStart
 
       Android:layout_marginEnd
 
Android:padding
 
       Android:paddingLeft
 
       Android:paddingEnd
 
       Android:paddingRight
 
       Android:paddingStart
 
       Android:paddingBottom
 
       Android:paddingTop
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

# 3.id引用属性

以下的属性值必须为id的引用名字 @id/id-name

Android:layout_alignBaseLine
 
Android:layout_alignEnd
 
Android:layout_alignStart
 
Android:layout_alignBottom
 
Android:layout_alignLeft
 
Android:layout_alignRight
 
Android:layout_alignTop
 
Android:layout_toStartOf     这个一般父元素布局为相对布局？
 
Android:layout_toEndOf
 
Android:layout_toRightOf
 
Android:layout_toLeftOf
 
Android:layout_above
 
Android:layout_below
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

4.特殊属性 android:orientation

该属性用于定义该LinearLayout内的各种控件的排列对齐方式。

有”vertical”和”horizontal”两种值，分别表示垂直对齐和水平对齐。

当android:orientation设置为vertical时，一行只能有一个元素，而不管该元素有多宽；

当设置为horizontal时，则所有元素都在一行，不会换行。

android:layout_width与android:layout_height

用于定义控件的宽度与高度。它也有两个值分别是：match_parent wrap_content。

”match_parent”表示控件的宽/高度以其父视图大小为准，即填满父视图的空间；

”wrap_content”随着视图中内容的不同而改变控件的宽度或者高度，类似于自动设置宽/高的意思。

需要注意的是，这两个属性会受android:layout_weight的影响。

当然，你还可以使用android:layout_width和android:layout_height指定宽度和高度时，可指定尺寸，如25dp。

如果不想指定具体的宽度和高度时，可以使用“wrap_content”使控件根据内容来自适应或者可以使用“wrap_parent”占满该控件所在容器的所有空间。

android:gravity

控件中的内容的对齐方式，默认是left and top aligned

(左上，前者left表示垂直方位上的对齐方式，后者top表示水平方位上的对齐方式，对齐时都是以包含控件的视图的中心点为基准的)

android:layout_gravity

设置该view相对与起父view 的位置．

比如一个button在linearlayout里，你想把该button放在靠左、靠右等位置就可以通过该属性设置．

以button为例，android:layout_gravity="right"则button靠右。

也就是说android:gravity用于设置View中内容相对于View组件的对齐方式，

而android:layout_gravity用于设置View组件相对于Container的对齐方式。

原理跟android:paddingLeft、android:layout_marginLeft有点类似。如果在按钮上同时设置这两个属性。

android:paddingLeft="30px" 按钮上设置的内容离按钮左边边界30个像素

android:layout_marginLeft="30px" 整个按钮离左边设置的内容30个像素

android:layout_alignParentRight="true" 属性是子控件针对父容器的。 且父容器必须是RelativeLayout

线性布局中若包含子线性布局，则必须设置 android:layout_weight="1" 关于这个属性还有很多，搜索android:layout_weight深刻理解，可深入了解它。


水平布局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!--orientation= vertical(垂直) / horizontal(水平) -->
    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="iqqco"
        android:textSize="26sp"
        android:background="#FF0000"
        android:layout_weight="1"/>

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="iqqcode"
        android:textSize="26sp"
        android:background="#00FF00"
        android:layout_weight="2"
        android:layout_gravity="center"/>

    <TextView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="iqqcode"
        android:textSize="26sp"
        android:background="#0000FF"
        android:layout_weight="3"
        android:layout_gravity="bottom"/>
</LinearLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

# 聊天Demo窗口

image-20201124143420318

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:background="#333333"
        android:orientation="horizontal"
        android:padding="15dp">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:text="<"
            android:textColor="#FFFFFF"
            android:textSize="28sp" />

        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_weight="1"
            android:text="iqqcode"
            android:textColor="#FFFFFF"
            android:textSize="24sp" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@mipmap/menu_logout_icon" />
    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:orientation="horizontal">

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:background="#cccccc"
        android:orientation="horizontal">

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:src="@mipmap/chatting_setmode_voice_btn_normal" />

        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:src="@mipmap/sns_shoot_emotion_icon_normal" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:src="@mipmap/type_select_btn_nor" />
    </LinearLayout>

</LinearLayout>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
编辑 (opens new window)
上次更新: 2022/10/25, 23:13:03
常用布局
相对布局RelativeLayout

← 相对布局RelativeLayout→

最近更新
01
匿名内部类
10-08
02
函数式接口
10-08
03
ARouter-Kotlin踩坑
10-05
更多文章>
Theme by Vdoing | Copyright © 2021-2023 iqqcode | MIT License | 备案号-京ICP备2021028793号
×