Android开发 - 掌握ConstraintLayout(七)辅助线(Guideline)
了解过UI设计的同学都知道,在设计的时候,我们经常在界面上拖进一些辅助线来帮我们对齐UI元素,或者方便我们统一的页边距。
在ConstraintLayout的编辑器中,同样也支持这样的功能,我们可以创建一些横向的或者纵向的Guideline,在布局界面的时候可以充分利用这些辅助线,对齐我们的View,避免重复写一些marginXXX。
创建Guideline
打开编辑器,选择Helpers -> Add Vertical Guideline

创建后,默认的Guideline是靠左的:

我们可以拖动来调整这个Guideline的边距,也可以通过右侧的属性栏直接输入边距的大小:

细心的同学可能发现,这里除了设置左边局,还有一个layout_constraintGuide_end,这个是做什么用的呢?没错,如果设置这个值,那么这条Guideline就是靠右的!
还有layout_constraintGuide_percent,从名字就可以看出,这个是按宽度的百分比设置边距,这个值的范围是0-1。(0% - 100%)
设置好辅助线后,我们就可以将View约束到这条辅助线上了。

当调整这条Guideline的边距时,约束对应的所有View也会做相应地改变,非常方便。
我们这里以靠左垂直的Guideline进行举例,读者可以创建一个右边的Guideline或者水平方向的Guideline进行尝试。
总结
Guideline可以帮助我们更方便地进行布局,尤其是当我们的页面左右边距都是一个固定值的时候,还有在设计师调整UI的左右边距的时候,我们也可以非常迅速地做出调整。
下一篇:Android开发 - 掌握ConstraintLayout(八)障碍线(Barrier),我们将介绍Barrier的使用。
如有更多疑问,请参考我的其它Android相关博客:我的博客地址
Android开发 - 掌握ConstraintLayout(七)辅助线(Guideline)的更多相关文章
- Android开发 - 掌握ConstraintLayout(六)链条(Chains)
本文我们介绍链条(Chains),使用它可以将多个View连接起来,互相约束. 可以创建横向的链条,也可以创建纵向的链条,我们以横向的链条举例: 我们先创建三个按钮: 我们选中三个按钮后在上面点右键创 ...
- Android开发 - 掌握ConstraintLayout(十)按比例设置视图大小
有时候在布局界面的时候,UI要求某个View或者某张图片按比例显示,以适应不同的屏幕分辨率. 通常我们时通过自定义View或者引入第三方的库来解决.现在我们既然已经使用了ConstraintLayou ...
- Android开发 - 掌握ConstraintLayout(九)分组(Group)
使用ConstraintLayout后我们的布局是没有层级关系的,各个View之间都是平级关系,但是如果根据某个业务条件来控制多个View的显示与否,我们需要分别对每个View进行控制,需要调用多次s ...
- Android开发 - 掌握ConstraintLayout(八)障碍线(Barrier)
本文我们来介绍障碍线(Barrier)的使用,平常在开发中用的相对要少一些,但是在需要时会非常方便. 它的作用是将多个元素放到这个障碍线里面使时,其中的任何元素的大小或位置变化时都会使它的位置进行改变 ...
- Android开发 - 掌握ConstraintLayout(五)偏差(Bias)
比如实现这样一个场景: "在屏幕宽度的1/4的地方放置一个View" 使用传统布局时,实现按照屏幕的宽度(高度),或者相对两个View之间距离的一个比例来进行布局,就显得非常麻烦, ...
- Android开发 - 掌握ConstraintLayout(四)创建基本约束
上一篇我们介绍了编辑器的基本使用,本文我们介绍创建基本的约束. "约束"表示View之间的位置关系.当我们在ConstraintLayout布局中创建View时,如果我们没有添加任 ...
- Android开发 - 掌握ConstraintLayout(三)编辑器
从本篇博客开始我们开始介绍如何使用ConstraintLayout. 既然ConstraintLayout叫约束布局,首先我们先介绍什么叫约束(Constraints): 约束(Constraints ...
- Android开发 - 掌握ConstraintLayout(二)介绍
介绍 发布时间 ConstraintLayout是在2016的Google I/O大会上发布的,经过这么长时间的更新,现在已经非常稳定. 支持Android 2.3(API 9)+ 目前的Androi ...
- Android开发 - 掌握ConstraintLayout(一)传统布局的问题
在传统的Android开发中,页面布局占用了我们很多的开发时间,而且面对复杂页面的时候,传统的一些布局会显得非常复杂,每种布局都有特定的应用场景,我们通常需要各种布局结合起来使用来实现复杂的页面.随着 ...
随机推荐
- redis各类错误可能的解决方案
.报Timeout performing EVAL 这个可能是连到读库从库了,直接改成写库就没问题了. 2. 各种ConnectTimeout 一般是偶尔或经常就超时,这种情况,找了各种回答,最后在s ...
- Spark2.0学习(三)--------核心API
Spark核心API----------------- [SparkContext] 连接到spark集群,入口点. [HadoopRDD] 读取hadoop上的数据, [MapPartitionsR ...
- 过滤器(Filter)与拦截器(Interceptor )区别
目录 过滤器(Filter) 拦截器(Interceptor) 拦截器(Interceptor)和过滤器(Filter)的区别 拦截器(Interceptor)和过滤器(Filter)的执行顺序 拦截 ...
- How to Read a Paper
How to Read a Paper 原文: https://www.yuque.com/lart/papers/yrkv5u 题目:How to Read a Paper 作者:S. Keshav ...
- js 内置对象参考 (Array,String, Math, Data, Number)
var str = "helloWorld"; var strOne = "helloWorld"; // charAt() 返回在指定位置的字符. var a ...
- vue中提示$index is not defined
今天学习Vue中遇到了一个报错信息:$index is not defined,是我写了个for循环在HTML中,然后是因为版本的问题 下面是解决方法: 原来的是 v-for="person ...
- mysql伪列
<!-- NOTE:internal_name_trim使用的是伪列,而不是数据库返回的数据 --><select id="listByStoreIdAndPartsN ...
- ZOJ 2507 Let's play a game
题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemId=1507 MisereNim博弈.代码如下: //=========== ...
- vs2015 不能启动 iis express
删除以下目录的文件 <<path_to_solution_folder>>\.vs\config\applicationhost.config具体地址http://stacko ...
- tensorflow学习之(十一)将python代码写入文件
#save to file import tensorflow as tf import numpy as np ##(1)Save to file 把相关变量存储到文件中 #remember to ...