Android布局

目录

 

传统布局

RelativeLayout（相对布局）

FrameLayout（帧布局）

GridLayout（网格布局）

LinearLayout（线性布局）

四个布局的优缺点

特殊布局

FlexboxLayout

特点

属性

ConstraintLayout（约束布局）

特点

属性

优点

Android中布局的优化方案

删除布局中无用的控件和层级

选择耗费性能较少的布局

提高布局的复用性（使用布局标签）

减少布局的层级（使用布局标签）

减少初次测量&绘制时间

1.使用标签

减少控件的使用（善用控件属性）

---

传统布局

布局类型	定义	特有属性	特点	应用场景
RelativeLayout（相对布局）	是一种相对布局，控件的位置是按照相对位置来计算的，后一个控件在什么位置依赖于前一个控件的基本位置，是布局最常用，也是最灵活的一种布局。	相对于父控件属性： layout_alignParentX：当前控件对齐父控件的X方位（Top、Bottom、Left、Right、Start、End） layout_centerX：当前控件位于父控件的X方向中间位置（Horizontal、Vertical、Inparent） 相对于指定控件属性： layout_X：当前控件位于指定id控件的X方位（above、below、toLeftOf、toRightOf） layout_alignX：当前控件位于指定id控件的X边缘对齐（Bottom、Left、Right、Top、Start）	根据参照物（某一控件）的位置，来定位控件的位置	控件之间存在相应位置的关系
FrameLayout（帧布局）	FrameLayout 整个界面被当成一块空白备用区域，所有的子元素都不能被指定放置的位置，它们统统放于这块区域的左上角，并且后面的子元素直接覆盖在前面的子元素之上，将前面的子元素部分和全部遮挡。	只具备基础属性	放入的所有控件，都被放置在最左上的区域 无法为控件指定一个确切的位置 下一个子控件会重叠覆盖上一个子控件	浏览单张图片
GridLayout（网格布局）	GridLayout 是Android4.0增加的网格布局控件，与之前的TableLayout有些相似，它把整个容器划分为rows × columns个网格，每个网格可以放置一个组件。性能及功能都要比Tablelayout好，比如GridLayout布局中的单元格可以跨越多行，而tablelayout则不行，此外，其渲染速度也比Tablelayout要快。	本身属性： rowCount：设置最大行数 columnCount：设置最大列数 子元素属性： layout_row,layout_column：设置子控件的行数、列数 layout_rowSpan,layout_columnSpan：设置控件所占的行数、列数 layout_rowWeight,layout_columnWeight：设置控件的行、列权重	它不但能像Tab了Layout那样，实现网格类布局，但它更为强大的地方在于每个Cell的大小可以横向或者纵向拉伸，每个Cell的对齐方式也有很多种，而且不像TableLayout，需要一个Tablerow，GridLayout可以通过指定Cell的坐标位置就能实现Cell的拉伸，从而实现，大小不一致的风格卡片式布局。	通常对于类似于网格的布局就可以考虑用GridLayout来实现，或者用LinearLayout横七竖八的套了好几层时也要考虑使用GridLayout
LinearLayout（线性布局）	LinearLayout 按照垂直或者水平的顺序依次排列子元素（通过android:orientation属性来控制），每一个子元素都位于前一个元素之后。	orientation：设置布局内控件的排列方式（水平，垂直） layout_weight：根据设置的权重，将布局的空间按比例分配	控件的排列方式 = 线性的垂直 / 水平	布局方式 = 线性的垂直 / 水平分布

四个布局的优缺点

1，RelativeLayout(相对布局)

优点：灵活性高--控件可以任意摆放位置、可以立体重叠摆放-------->适合作为最外层布局

缺点：需要不断地设置参考系，使用较为繁琐，操作不当会造成控件之间相互影响

2，LinearLayout（线性布局）

优点：自动在一个方向上进行布局，通过距离或权重控制控件的放置---------->操作简单，容易上手

缺点：死板，只能在某一方向上排布且不能换行

3，GridLayout（网格布局）

优点：可以设置行列，自动换行-------------->适用于排列比较整齐的网格化布局，比如计算器等

缺点：样式比较呆板，适用范围较小

4，FrameLayout（帧布局）

优点：方式简单，常被系统作为默认布局

缺点：广泛适用性不强

特殊布局

FlexboxLayout

FlexboxLayout是一个Android平台上与CSS的 Flexible box 布局模块 有相似功能的库。

特点

• FlexboxLayout可以理解成一个高级版的LinearLayout，因为两个布局都把子view按顺序排列。两者之间最大的差别在于FlexboxLayout具有换行的特性。

• 同时 FlexboxLayout 还为 RecycleView 提供了管理器FlexboxLayoutManager

       

属性

属性与CSS中Flexbox的属性基本一致，可参考FlexBox属性。

ConstraintLayout（约束布局）

Constraint Layout 是Android Studio 2.2中主要的新增功能之一，也是Google在2016年的Google I/O大会上提出的一个可以灵活控制子控件的位置和大小的新布局。它可以有效地解决布局嵌套过多的问题。我们平时编写界面，复杂的布局总会伴随着多层的嵌套，而嵌套越多，程序的性能也就越差。ConstraintLayout则是使用约束的方式来指定各个控件的位置和关系的，它有点类似于RelativeLayout，但远比RelativeLayout要更强大。

特点

• 通过约束的方式指定各个控件的位置&关系

• 可视化布局 = 拖拽控件布局

属性

优点

• 布局调整更为方便，所见即所得

• 布局之间相对位置更好控制

• 动态创建布局方便，对控件的控制能力更加强大，可以实现动画效果

 

Android中布局的优化方案

1. 删除布局中无用的控件和层级

2. 选择耗费性能较少的布局

   如果布局中即可使用LinearLayout也可以使用RelativeLayout，那就采用LinearLayout。因为RelativeLayout在绘制时需要对子View分别进行了竖直和水平方向的两次测量，而Linearlayout在绘制时是根据我们设置的方向分别调用不同的测量方法。注意一点如果LinearLayout中子View使用了layout_weight属性时同样需要对子View进行两次测量以确定最终大小。LinearLayout和FrameLayout都是一种性能耗费低的布局。但是很多时候单纯通过一个LinearLayout或FrameLayout无法实现产品的效果，需要通过嵌套的方式来完成。这种情况下建议使用RelativeLayout，因为嵌套就相当于增加了布局的层级，同样会降低程序的性能。

   • 性能耗费低的布局 = 功能简单 = FrameLayout、LinearLayout

   • 性能耗费高的布局 = 功能复杂 = RelativeLayout（ConstraintLayout）

   • 嵌套所耗费的性能 > 单个布局本身耗费的性能

3. 提高布局的复用性（使用布局标签）

   使用 标签提取布局间的公共部分，通过提高布局的复用性从而减少测量 & 绘制时间

4. 减少布局的层级（使用布局标签）

   布局标签一般和 标签一起使用从而减少布局的层级。例如当前布局是一个竖直方向的LinearLayout，这个时候如果被包含的布局也采用了竖直方向的LinearLayout，那么显然被包含的布局文件中的LinearLayout是多余的，这时通过 布局标签就可以去掉多余的那一层LinearLayout。

5. 减少初次测量&绘制时间

   1.使用标签

   ViewStub继承了View，它非常轻量级且宽和高都为0，因此它本身不参与任何的绘制过程，避免资源的浪费，减少渲染时间，在需要的时候才加载View。因此ViewStub的意义在于按需求加载所需的布局，在实际开发中，很多布局在正常情况下不会显示，比如加载数据暂无数据，网络异常等界面，这个时候就没必要在整个界面初始化的时候将其加载进来，通过ViewStub就可以做到在使用时在加载，提高了程序初始化时的性能。
    

   
   
   
   
       
   
       
   
   
   
   
   
   
   
       //view_stub是ViewStub的id，empty是empty_data.xml这个布局根元素的id
       
   
   
   
   
   @Override
       protected void onCreate(Bundle savedInstanceState) {
           super.onCreate(savedInstanceState);
           setContentView(R.layout.activity_main);
           ButterKnife.bind(this);
           //加载ViewStub中的布局的两种方式setVisibility或inflate
           mViewStub.setVisibility(View.VISIBLE);
           mViewStub.inflate();
           
       }
   
   

   
   2.尽可能少用布局属性wrap_content
   布局属性 wrap_content 会增加布局测量时计算成本，应尽可能少用

6. 减少控件的使用（善用控件属性）