一.介绍

ConstraintLayout是一个ViewGroup允许您以灵活的方式定位和调整窗口小部件的窗口。从api9开始支持.继承自viewGroup;

二.具体使用

这个控件的具体分类主要有如下几类

1.相对定位

翻译一下 中间表示相对于自身的某个部位,后面的表示对你设置的那个控件的位置,下图是位置图

layout_constraintLeft_toLeftOf =" praent" //表示将自己部位的左边位于父容器的左边
layout_constraintLeft_toRightOf
layout_constraintRight_toLeftOf
layout_constraintRight_toRightOf
layout_constraintTop_toTopOf
layout_constraintTop_toBottomOf
layout_constraintBottom_toTopOf
layout_constraintBottom_toBottomOf
layout_constraintBaseline_toBaselineOf
layout_constraintStart_toEndOf
layout_constraintStart_toStartOf
layout_constraintEnd_toStartOf
layout_constraintEnd_toEndOf

2.边距

  • 这里和我们的Relative的margin差不多意思

表示如下

android:layout_marginStart
android:layout_marginEnd
android:layout_marginLeft
android:layout_marginTop
android:layout_marginRight
android:layout_marginBottom
  • 当2个view有相对位置的依赖关系,当其中一个view设置1位gone时,这个比较有意思,比方说假设A设置为gone,后,B需要距离父布局的左侧200dp,怎么办?这时候,goneMargin属性就派上用场啦,只要设置B的layout_goneMarginLeft=200dp即可。这样,A不为gone的时候,B距离A 为android:layout_marginLeft ,A为gone时,B距离父布局左侧layout_goneMarginLeft200dp。
layout_goneMarginStart
layout_goneMarginEnd
layout_goneMarginLeft
layout_goneMarginTop
layout_goneMarginRight
layout_goneMarginBottom

3.居中定位和偏向定位

  • 1.如果我们没有 app:layout_constraintVertical_bias="0.7"这行代码,这个button就处于父容器内的竖直方向的中间位置,这时候如果你要设置比例比如说偏高一点,这是就没办法分配了,所以推出了这个控件
<Button
android:id="@+id/button5"
android:layout_width="120dp"
android:layout_height="48dp"
android:text="第五个"
app:layout_constraintVertical_bias="0.7"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
/>

定位的方法有竖直和水平偏向2种如下,数值必须处于0-1之间

layout_constraintHorizontal_bias
layout_constraintVertical_bias
  • 2.recycle定位(圆形定位)
layout_constraintCircle :引用另一个小部件ID
layout_constraintCircleRadius :到其他小部件中心的距离
layout_constraintCircleAngle :小部件应该在哪个角度(度数,从0到360)

4.可见性行为

ConstraintLayout具有标记为的小部件的特定处理View.GONE。GONE像往常一样,小部件将不会被显示,也不是布局本身的一部分(即,如果标记为其实际尺寸不会被改变GONE)。但就布局计算而言,GONE小部件仍然是其中的一部分,具有重要的区别:

  • 对于布局过程,它们的维度将被视为零(基本上,它们将被解析为一个点)
  • 如果他们对其他小部件有限制,他们仍然会受到尊重,但是任何距离都将等于零,被gone的布局将会视为一个点

5.维度约束

  1. 设置最小尺寸和我们平常的布局一样
android:minWidth 设置布局的最小宽度
android:minHeight 设置布局的最小高度
android:maxWidth 设置布局的最大宽度
android:maxHeight 设置布局的最大高度
  1. 设置通常布局有,注意的是当为0时,视为match
android:layout_width = warp/match/特定数值
android:layout_height
<Button
android:id="@+id/button5"
android:layout_width="120dp"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:1" //表示匡高比1:1 但是你必须设置一个维度为0,可以填比也可以填比的值
android:text="第五个"
app:layout_constraintVertical_bias="0.7"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
/>

6.链

  1. 如果2个控件通过双向链接链接在一起,则他们被视为链,链的第一个元素被称为链头,一般是水平链的最左边不见也是垂直最顶端的



ConstraintLayout布局介绍.md的更多相关文章

  1. Android 基础:常用布局 介绍 & 使用(附 属性查询)

    Android 基础:常用布局 介绍 & 使用(附 属性查询)   前言 在 Android开发中,绘制UI时常需各种布局 今天,我将全面介绍Android开发中最常用的五大布局 含 Andr ...

  2. WPF Step By Step 完整布局介绍

    WPF Step By Step 完整布局介绍 回顾 上一篇,我们介绍了基本控件及控件的重要属性和用法,我们本篇详细介绍WPF中的几种布局容器及每种布局容器的使用场景,当 然这些都是本人在实际项目中的 ...

  3. html5/css3响应式布局介绍及设计流程

    html5/css3响应式布局介绍 html5/css3响应式布局介绍及设计流程,利用css3的media query媒体查询功能.移动终端一般都是对css3支持比较好的高级浏览器不需要考虑响应式布局 ...

  4. 转:CSS3 Flexbox 布局介绍

    转:CSS3 Flexbox 布局介绍 Flexbox是一个用于页面布局的全新CSS3模块功能.它可以把列表放在同一个方向(从左到右或从上到下排列),并且让这些列表能延伸到占用可用的空间.较为复杂的布 ...

  5. Android ConstraintLayout 布局警告

    使用 ConstraintLayout 布局出现警告: 此视图不受垂直约束.在运行时,除非添加垂直约束,否则它将跳转到左侧 解决办法: 从Android Studio v3及更高版本开始,从下拉列表中 ...

  6. AndroidStudio制作登录和注册功能的实现,界面的布局介绍

    前言 大家好,给大家带来AndroidStudio制作登录和注册功能的实现,界面的布局介绍的概述,希望你们喜欢 每日一句: Success is connecting with the world a ...

  7. HTML 页面源代码布局介绍

    http://www.cnblogs.com/polk6/archive/2013/05/10/3071451.html 此介绍以google首页源代码截图为例: 从上到下依次介绍: 1.<!D ...

  8. Android五大布局介绍&属性设置大全

    前言 在进行Android开发中,常常需要用到各种布局来进行UI的绘制,今天我们就来讲下Android开发中最常用的五大布局介绍和相关属性的设置. 目录 Android五大布局介绍&属性设置. ...

  9. Qt Quick 布局介绍

    在 Qt Quick 中有两套与布局管理相关的类库,一套叫作 Item Positioner(定位器),一套叫作 Item Layout(布局). 定位器包括 Row(行定位器).Column(列定位 ...

随机推荐

  1. 去除Vue在WebStorm中报命名空间的错误

    Preferences -> Editor -> Inspections找到XML,把 Unbound XML namespace prefix的勾去掉

  2. 使用 js 设置组合快捷键,支持多个组合键定义,还支持 React

    ╭┈┈╮ ╭┈┈╮ ╭┈┈╮ ┆ ├┈┈..┈┈┈┈┈.┆ └┈╮┆ ├┈┈..┈┈┈┈┈..┈┈.┈┈..┈┈┈┈┈. ┆ ┆┆ □ ┆┆ ┈┤┆ < ┆ -__┘┆ ┆ ┆┆__ ┈┈┤ ╰ ...

  3. Fiddler修改请求和响应

    通过设置断点,Fiddler可以做到: 1. 修改HTTP请求头信息.例如修改请求头的UA, Cookie, Referer 信息,通过"伪造"相应信息达到达到相应的目的(调试,模 ...

  4. php和apache工作原理?

    1.CGI和FastCGI是apache处理php脚本的其中两种工作模式,还有ISAPI,SAPI等 2.而php-fpm并不是一种工作模式,而是一个PHP在FastCGI模式运行下的进程管理器,全称 ...

  5. 对lua表中数据按一定格式处理,循环

    function putStartCard(handCard) function dataDeal(array,a,b,c) cclog("进入datadeal=============== ...

  6. 腾讯云python网站开发环境搭建

    前段时间腾讯云做活动,于是就花了几百大洋买了三年的云服务,准备在上 面安装python web的开发环境,下面将安装过程做一个总结,希望能够帮助大家. 一.使用环境   使用的软件环境为:CentOS ...

  7. 作业01-Java基本概念

    1.本周学习总结 本周学习了JVM,JDK,JRE三者之间的区别及联系,知道JDK包括JRE,JRE包括JVM,知道java语言与C语言的不同之处在于java语言可以依赖于虚拟机实现"编译一 ...

  8. 第201621123043 《Java程序设计》第12周学习总结

    1. 本周学习总结 1.1 以你喜欢的方式(思维导图或其他)归纳总结多流与文件相关内容. 2. 面向系统综合设计-图书馆管理系统或购物车 使用流与文件改造你的图书馆管理系统或购物车. 2.1 简述如何 ...

  9. 20145237 《Java程序设计》第三周学习总结

    20145237 <Java程序设计>第3周学习总结 教材学习内容总结 第四章主要讲了Java基本类型中的类类型,如何定义类.构造函数.使用标准类.基本类型打包器.数组复制.字符串等内容查 ...

  10. prototype 原型链

    // 方法1 var aa=function(){ function bb(){ this.name="1111"; console.log(this.name) }; bb.pr ...