Android 布局巧用之include、merge、ViewStub
相信大家经常听到include
、merge
、ViewStub
这样的标签,官方也提到这三种布局可用于布局的优化。今天就介绍下这三种布局的使用,记录下来,便于后续app中的使用。
include
布局重用
app开发过程中,会遇到不同页面里有相同的布局,这时我们可以将这些通用的布局提取出来到一个单独的layout
文件里,再使用<include>
标签引入到相应的页面布局文件里,主要通过include
的layout
属性引用。
举个栗子
include
的布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="这里是来自include布局" />
</RelativeLayout>
activity
的布局:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/tv2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="以下的内容来自include标签" />
<include
android:id="@+id/container"
layout="@layout/include_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/tv"
android:layout_marginTop="10dp" />
</RelativeLayout>
这个标签在日常工作使用还是很常见的。这里有几点需要注意下:
1、如果给include
标签 和 include
所加载的布局 都添加id的话,那么id要保持一致,如例子中都是container
,否则是在代码中获取不到RelativeLayout
容器的。 当然我们可以避免这样的问题,只需要给其中一项添加id属性就可以。
2、include
布局里元素的id 要和 include
所在页面布局里的其他元素id 不同,如例子中的两个textview
,如果把id设置相同了,程序运行起来并不会报错,但是textview
的赋值只会赋值给其中的一个。
3、如果需要给include
标签设置位置属性的话,如例子中的layout_below
、layout_marginTop
,这时候 必须 同时设置include
标签的宽高属性layout_width
、layout_height
,否则编译器是会报错的。一般情况不需要设置include
的其他属性,直接加载布局文件 <include layout="@layout/...."/>
4、布局中可以包含两个相同的include标签,如下代码所示 两个include
都加载layout="@layout/include_layout"
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="以下的内容来自include标签" />
<include
android:id="@+id/container"
layout="@layout/include_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="@+id/tv"
android:layout_marginTop="10dp" />
<include
android:id="@+id/container2"
layout="@layout/include_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="80dp" />
</RelativeLayout>
可以设置不同include
的id属性,引用的时候如下可以正常显示:
View view = findViewById(R.id.container2);
TextView textView = view.findViewById(R.id.tv);
textView.setText("这里是来自 第二个 include布局");
merge减少视图层级
merge
标签可用于减少视图层级来优化布局,可以配合include
使用,如果include
标签的父布局 和 include
布局的根容器是相同类型的,那么根容器的可以使用merge
代替。
页面布局
<?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">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="以下的内容不是来自merge标签" />
<include
layout="@layout/merge_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp" />
</LinearLayout>
先看没有使用merge
的:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="这里是不是来自merge布局" />
</LinearLayout>
看下view层的结构:
再看使用了merge
的:
<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="这里是来自merge布局" />
</merge>
view层结构:
可以看到对比,减少了一层的LinearLayout
的嵌套,需要注意的是使用merge
的布局,在include
的标签设置距离属性没有生效,可以将一些间距属性设置到include
布局里元素上,具体看项目需求使用。
ViewStub按需加载
按需加载 顾名思义需要的时候再去加载,不需要的时候可以不用加载,节约内存使用。通常情况我们会使用setVisibility
方法来控制视图的显示和隐藏,但是这种情况视图已经加载了。
比如app中页面里某个布局只需要在特定的情况下才显示,其余情况下可以不用加载显示,这时候可以使用ViewStub
。
layout
属性是需要加载布局
<?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">
<ViewStub
android:id="@+id/viewstub"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout="@layout/viewstub_layout" />
</LinearLayout>
需要注意的是 ViewStub
的inflate()
方法只能被调用一次,一旦调用后,ViewStub
将从视图中移除,被对应的layout
布局取代,同时会保留ViewStub
上设置的属性效果。
ViewStub viewstub = findViewById(R.id.viewstub);
viewstub.inflate();
这篇关于include
、merge
、ViewStub
的使用就介绍到这里了,具体使用情况还得视项目而定。
最后附上github地址https://github.com/taixiang/include
欢迎关注我的博客:https://blog.manjiexiang.cn/
更多精彩欢迎关注微信号:春风十里不如认识你
Android 布局巧用之include、merge、ViewStub的更多相关文章
- 布局重用 include merge ViewStub
在布局优化中,Androi的官方提到了这三种布局<include />.<merge />.<ViewStub />,并介绍了这三种布局各有的优势,下面也是简单说一 ...
- android布局中使用include及需注意点
在android布局中,使用include,将另一个xml文件引入,可作为布局的一部分,但在使用include时,需注意以下问题: 一.使用include引入 如现有标题栏布局block_header ...
- include的用法例子,以及include+merge的用法例子
[include+LinearLayout]的使用例子 AndroidIncludeLayout.java package com.AndroidIncludeLayout; import andro ...
- android 布局优化常用技巧
android对多个模块都要是要的UI逻辑的致辞除了fragment之外,没有别的东西可以支持了, include,merge,viewstub只能支持公用的ui,但是这个通用支持不能包含逻辑(jav ...
- Android布局优化之include、merge、ViewStub的使用
本文针对include.merge.ViewStub三个标签如何在布局复用.有效减少布局层级以及如何可以按需加载三个方面进行介绍的. 复用布局可以帮助我们创建一些可以重复使用的复杂布局.这种方式也意味 ...
- Android布局优化:include 、merge、ViewStub的详细总结
版权声明:本文出自汪磊的博客,未经作者允许禁止转载. 本篇博客主要是对上篇博客的补充Android性能优化之UI渲染性能优化, 没有什么新东西,觉得应该是都掌握的玩意,写出来也只是自己做个小小的总结. ...
- Android性能优化:布局优化 详细解析(含<include>、<ViewStub>、<merge>讲解 )
1. 影响的性能 布局性能的好坏 主要影响 :Android应用中的页面显示速度 2. 如何影响性能 布局影响Android性能的实质:页面的测量 & 绘制时间 1个页面通过递归 完成测量 & ...
- Android性能优化xml之<include>、<merge>、<ViewStub>标签的使用
一.使用<include>标签对"重复代码"进行复用 <include>标签是我们进行Android开发中经常用到的标签,比如多个界面都同样用到了一个左侧筛 ...
- 【转】在Android布局中使用include和merge标签
内容转自:http://fengweipeng1208.blog.163.com/blog/static/21277318020138229754135/ 在我们开发android布局时,经常会有很多 ...
随机推荐
- 使用idea配置tomcat将web项目跑起来
链接:https://www.cnblogs.com/avivaye/p/6437555.html
- VIM -小技巧汇总
一 代码自动对齐: 1 命令行模式下先输入gg 然后按=后输入大写的G,这样整个文件的代码就对齐了. 二 选中多行缩进 1.按v进入visual状态,选择多行,用>或<缩进或缩出 2. 通 ...
- 机器学习入门04 - 使用TensorFlow的起始步骤 (First Steps with TensorFlow)
原文链接:https://developers.google.com/machine-learning/crash-course/first-steps-with-tensorflow/ 1- 工具包 ...
- 分布式作业 Elastic Job 如何动态调整?
前面分享了两篇分布式作业调度框架 Elastic Job 的介绍及应用实战. ElasticJob-分布式作业调度神器 分布式作业 Elastic Job 快速上手指南! Elastic Job 提供 ...
- 解决ionic3 android 运行出现Application Error - The connection to the server was unsuccessful
在真机上启动ionic3打包成的android APK,启动了很久结果弹出这个问题: Application Error - The connection to the server was unsu ...
- Python Selenium 常用方法总结(不断补充)
还有此篇内容也丰富Selenium常见元素定位方法和操作的学习介绍 selenium Python 总结一些工作中可能会经常使用到的API. 1.获取当前页面的Url 方法:current_url 实 ...
- python练习五—简单web应用
配置apache 我以前web开发基本都是基于java平台的,比如tomcat,servlet等等,由tomcat接收http请求,然后交给servlet处理,servlet处理完成以后把返回结果交给 ...
- python练习四—简单的聊天软件
python最强大的是什么?库支持!!有了强大的库支持,一个简单的聊天软件实现就更简单了,本项目思路如下 # 项目思路 1. 服务器的工作 * 初始化服务器 * 新建一个聊天房间 * 维护一个已链接用 ...
- Python3获取拉勾网招聘信息
为了了解跟python数据分析有关行业的信息,大概地了解一下对这个行业的要求以及薪资状况,我决定从网上获取信息并进行分析.既然想要分析就必须要有数据,于是我选择了拉勾,冒着危险深入内部,从他们那里得到 ...
- curl模拟post json或post xml文件
转自: https://www.cnblogs.com/xiaochina/p/9750851.html 问题描述: Linux用命令模拟接口,对接口判断!post文件xml/json 问题解决: c ...