页面布局

概述

UI界面可以完全使用代码创建

事实上，用XML定义的界面，最后也是要转换为代码来实现布局的。

xml vs. code ▪ 在Layout文件中使用XML语法声明UI 组件。 ▪ 直观简洁，可读性强； ▪ 实现了UI界面和逻辑代码的初步分离 ▪ 完全使用代码构造应用程序界面 ▪ 完全可控，具有较强的灵活性 ▪ 免去了Inflation过程，性能不受损失 ▪ 可读性比较差；容易写出耦合性强的代码，可维护性较低。

实际开发中，应该使用XML为设计UI的主要方式，代码作为辅助手段。 但现在Google正在研发一种称为Compose的技术，完全使用kotlin取代 XML来定义界面，非常值得关注，它很可能代表了技术的发展方向。

view及其子类

所有Android控件，都是View的子类

viewGroup

View有一个特殊的子类，称为ViewGroup。 ViewGroup提供了对其子组件的管理功能，包括布局、动画等。 ViewGroup的子组件可以是View也可以是ViewGroup。 常用的布局控件（比如LinearLayout）都是ViewGroup的子类。

ViewGroup可以动态地添加和移除它的子组件，并且可以多重嵌套，这是Android构建复杂UI界面的关键技术手段。

很多Android App的界面，都可以划分为多层的ViewGroup嵌套结构，称为“Component Tree（组件树）”。

在UI设计器中，AndroidStudio会呈现出当前布局对应的组件树。

布局-盒子模型

Margin：控件之间的“空白”区域

Padding：控件内部具体内容与控件边界之间的区域

• View支持padding，但是不支持margin。 • ViewGroup支持padding和margin

Box模型是Android App界面布局的基础，这一模型同样是Web开发中网页布局设计的基础，手机App界面与Web网页，在这里是一致的。

“三层”嵌套控件的Padding和Margin布局实例

每个控件都需要在屏幕上占据一个矩形的位置，因此，它的左上角坐标及其长和宽是关键要素，但我们并不需要在程序中人为指定它们。

Android控件所占的具体位置，是由其父控件（主要就是布局控件）通过layout_width和layout_height等相关布局属性在App运行时“动态”计算出来的，上述两个属性可以取的值有三种：

1. 固定值：比如100dp
2. wrap_content：数值依控件所显示的具体内容而定
3. match_parent：与其父控件的数值相匹配（一致）

布局单位

因为不同设备的分辨率不同，所以不能用像素作为绘图单位。

采用设备无关的像素（dp：Density-independent Pixel），能够让图像在不同分辨率的屏幕上都显示出一样的大小。

布局通常使用dp作为单位

而字体尺寸则使用sp（Scalable pixels）

作为单位，这两者基本上是一样的，只不过sp会保留用户的设置（比如用户可以选择使用大字体来显示App上的文本）。

颜色

内置颜色

Android系统有12种已经定义好的颜色，具体的类型定义在Color类中。

示例：

textView.setTextColor(Color.RED)

16进制颜色

在布局文件中设置颜色需要在色值前面加“#”，如 android:textColor="#000000"。

在代码中设置颜色可以直接填八位的十六进制数值，如 setTextColor(0xff00ff00)

也可以通过Color.rgb(int red, int green, int blue) 和Color.argb(int alpha, int red, int green, int blue)这两种方法指定颜色，后者可以同时指定“透明度alpha”。

标准颜色可以在https://www.w3schools.com/colors/colors_hex.asp查询到。

颜色常量名

在colors.xml中定义颜色，res/values目录下有个colors.xml文件，可用于定义颜色常量。

在实际开发中，如果希望多个UI元素都拥有一致的颜色，推荐在colors.xml中定义它们，给它们起个名字，然后通过名字来引用它们。

如果要在布局、样式等XML文件中使用颜色常量，可以使用

“@color/颜色常量名”的方式：

如果要在代码中使用XML颜色常量，在Activity中可通过这行代码获取： getResources().getColor(R.color.颜色常量名)。

常用布局控件

App界面需要支持响应式特性，在不同大小、不同类型的设备屏幕上都能正常显示。

布局控件需要依据特定的规则排列它的子控件，并且这个排列支持递归进行，因为UI控件被组织为一棵多叉树（控件树），所以下层控件需要声明它期望的“尺寸”，然后“上级”才能综合各种因素最终确定各子控件的大小和具体排列方式。

LinearLayout

LinearLayout是一种Android中最常用的布局，它将自己包含的子元素按照一个特定的方向进行排列。

排列方向有两种：水平和垂直

LinearLayout的典型声明示例

LinearLayout通常会嵌套存在

外层为垂直布局的LinearLayout，里面又内嵌一个水平布 局的LinearLayout。