ConstraintLayout 学习笔记
如何阅读 xml 属性
与 Relativelayout 不同,ConstrainLayout 的属性需要同时说明需要怎么操作自己与目标控件,例如:layout_constraintLeft_toLeftOf 指自身左边缘与目标控件左边缘对齐
从此 match_parent 是故人
ConstraintLayout 里不再使用 match_parent,想要铺满屏幕,只能设置宽度为 0,并添加左右边缘与父容器的约束。(** 想要实现 match_parent的效果,切记要设置该方向大小为 0dp **)
android:layout_width="0dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
穿了马甲的 LinearLayout
线性布局的 weight 属性可以轻松实现等分操作。在 ConstraintLayout 里你也可以实现类似的功能:
app:layout_constraintHorizontal_bias=".3" //数值范围:0~1
如果控件已约束了左右边缘且定义了 bias 为 0.3,则意味着控件与左边缘的距离占控件左右边缘间距的 30%,如图:
甚至想要实现 LinearLayout 的 weight=1 等分操作(例如水平方向上等分)也很简单,每个相邻控件互为约束并设置 width=0dp 即可。这样其实就组成了链(chaining)。
链
想上面说到的,设置 width=0,且控件之间两两互相约束,即可实现水平方向等分。此时还可以给控件设置 layout_constraintHorizontal_weight 属性,该属性与 LinearLayout 中的 weight 类似。
链条头部的属性
水平链的最左边,垂直链的最上边称之为头部,链的头部可以设置链的属性:
app:layout_constraintHorizontal_chainStyle="spread"
app:layout_constraintVertical_chainStyle="packed"
- spread 默认属性,平均分布
- spread_inside 首尾无间距
- packed 控件间无间距,可以同时搭配 layout_constraintHorizontal_bias 属性控制与父容器的间距
各属性值的样式如下:
厉害了,还能设宽高比
app:layout_constraintDimensionRatio="1:1" //宽:高
该属性起作用的前提是宽或高至少有一个设为 0dp,设为 0dp 的边即为随比例缩放的边。
举个栗子:
<TextView
android:layout_width="wrap_content"
android:layout_height="0dp"
app:layout_constraintDimensionRatio="1:1"/>
该文本框在随着内容文字的增加,宽度会越来越大,一旦设定了宽高比为1,则在宽度增大时高度也会等比增大,一直保持在宽高比1:1。
宽高比还有另外的妙用,比如一个控件左右边缘已存在与父容器约束,且同时将宽高都设为 0dp,便得到水平方向上铺满屏幕的效果,如图:
指示线 Guideline
指示线不会被绘制到 UI 中,所以放心大胆地用。Guideline 的一些属性:
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/guideline"
app:layout_constraintGuide_percent="0.5" //设置位置比例
android:orientation="vertical"/> //不注明该属性,则默认是水平方向
app:layout_constraintGuide_begin="30dp" //设置与头部边距
app:layout_constraintGuide_end="30dp" // 设置与尾部边距
其他
- layout_goneMarginLeft 属性,当有约束关系的控件被置为 gone 状态时,可以通过设置该属性来控制间距
动画
[译]Constraint Layout 动画 |动态 Constraint |用 Java 实现的 UI(这到底是什么)[第三部分]
ConstraintLayout 学习笔记的更多相关文章
- Flutter学习笔记(30)--Android原生与Flutter混编
如需转载,请注明出处:Flutter学习笔记(30)--Android原生与Flutter混编 这篇文章旨在学习如何在现有的Android原生项目上集成Flutter,实现Android与Flutte ...
- Android学习笔记(一)
目录 Android学习笔记(一) 一.JDK.Android SDK 二.部分项目结构 三.字符串引用 四.外层build.gradle详解 五.app->build.gradle详解 六.日 ...
- js学习笔记:webpack基础入门(一)
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
- PHP-自定义模板-学习笔记
1. 开始 这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2. 整体架构图 ...
- PHP-会员登录与注册例子解析-学习笔记
1.开始 最近开始学习李炎恢老师的<PHP第二季度视频>中的“章节5:使用OOP注册会员”,做一个学习笔记,通过绘制基本页面流程和UML类图,来对加深理解. 2.基本页面流程 3.通过UM ...
- 2014年暑假c#学习笔记目录
2014年暑假c#学习笔记 一.C#编程基础 1. c#编程基础之枚举 2. c#编程基础之函数可变参数 3. c#编程基础之字符串基础 4. c#编程基础之字符串函数 5.c#编程基础之ref.ou ...
- JAVA GUI编程学习笔记目录
2014年暑假JAVA GUI编程学习笔记目录 1.JAVA之GUI编程概述 2.JAVA之GUI编程布局 3.JAVA之GUI编程Frame窗口 4.JAVA之GUI编程事件监听机制 5.JAVA之 ...
- seaJs学习笔记2 – seaJs组建库的使用
原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...
- CSS学习笔记
CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...
随机推荐
- Oracle11gR2 RAC voting disk error
故障现象:2+3节点配置,alert日志中提示vote盘错误,集群无法拉起来. 分析过程:Oracle 11g RAC依据OLR,OCR,VOTE磁盘进行节点信息注册,维护集群状态以及完成选举投票.其 ...
- Docker 入门介绍
Docker是什么 从发布到现在 docker一直很受关注,在一定程度是改变了软件行业 如果你还不知道 docker 是什么是不是有点out了,接下来我们来介绍docker是什么,解决了什么问题,好处 ...
- java简单的实现搜索框的下拉显示相关搜索功能
最近做了一个简单的搜索框下面下拉显示相关搜索的功能,有点模仿百度的下拉展示相关搜索 先上个展示图 : 点击进入演示地址,大家可以输入长点的搜索,点击搜索,再输入之前搜索词的前面部分,看是否能展示出来 ...
- ElementUI el-date-picker 限制选中日期前后30天,大于当天不可选
<template> <el-date-picker v-model="date" type="daterange" range-separa ...
- 【CSP-S 2019】树的重心(重心的性质)
Description 给定一颗 \(n\) 个顶点的树 \(\text T\),共 \(n-1\) 次断边操作,每次将树分为两部分 \(\text T_1, \text T_2\),求: \[\su ...
- 题解-FJOI2018 领导集团问题
题面 FJOI2018 领导集团问题 给一棵树 \(T(|T|=n)\),每个点有个权值 \(w_i\),从中选出一个子点集 \(P=\{x\in {\rm node}|x\in T\}\),使得 \ ...
- CF1407D Discrete Centrifugal Jumps 题解
蒟蒻语 写了 \(100\) 行的 线段树上ST表维护二分维护单调栈维护dp, 结果最后发现只要俩单调栈就好了 = = 蒟蒻解 首先 \(dp_i\) 表示从 \(1\) 楼到 \(i\) 楼要跳几次 ...
- 云小课 | 需求任务还未分解,该咋整!项目管理Scrum项目工作分解的心酸谁能知?
温馨提醒:本文约3000字,需要阅读5分钟,共分为8个部分,建议分段阅读! 软件开发过程中,从产品概念形成到产品规划.往往要做详细的需求分析和项目规划等,因此,选对一款项目管理工具对开发者就显得尤为重 ...
- 【面试专栏】JAVA CAS(Conmpare And Swap)原理
1. CAS简介 在计算机科学中,比较和交换(Conmpare And Swap)是用于实现多线程同步的原子指令.它将内存位置的内容与给定值进行比较,只有在相同的情况下,将该内存位置的内容修改为新 ...
- 树莓派RPi.GPIO+Flask构建WebApi实现远程控制
#!/usr/bin/env python3 # -*- coding: utf-8 -*- import RPi.GPIO as GPIO from flask import Flask, requ ...