Android开发之约束布局平均分布|ConstraintLayout平均分布|约束布局均匀分布|ConstraintLayout均匀分布
老路子先看效果图
1.先画7个小球会全部重叠在一起
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:layout_width="match_parent"android:layout_height="80dp"><CheckBoxandroid:id="@+id/tv1"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="S"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv2"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="M"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv3"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="T"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv4"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="W"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv5"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="T"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv6"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="F"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv7"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="S"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
2.然后将7个小球一个挨着一个如下图:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:layout_width="match_parent"android:layout_height="80dp"><CheckBoxandroid:id="@+id/tv1"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="S"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv2"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="M"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toRightOf="@+id/tv1"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv3"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="T"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toRightOf="@+id/tv2"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv4"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="W"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toRightOf="@+id/tv3"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv5"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="T"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toRightOf="@+id/tv4"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv6"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="F"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toRightOf="@+id/tv5"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv7"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="S"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintLeft_toRightOf="@+id/tv6"app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
然后再使用chains引用链功能如下图
步骤=>先选中7个按钮,然后右键选择Chains->Create Horizontal Chains即可实现平均分布
好了简单功能如上:再看下完整代码:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:layout_width="match_parent"android:layout_height="80dp"><CheckBoxandroid:id="@+id/tv1"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="S"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toStartOf="@+id/tv2"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv2"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="M"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toStartOf="@+id/tv3"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv1"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv3"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="T"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toStartOf="@+id/tv4"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv2"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv4"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="W"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toStartOf="@+id/tv5"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv3"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv5"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="T"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toStartOf="@+id/tv6"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv4"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv6"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="F"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toStartOf="@+id/tv7"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv5"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv7"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="S"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv6"app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
布局中缺失的部分check_box_bg.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:state_checked="false"><shape><solid android:color="@color/wyze_color_CED6DE" /><corners android:radius="50dp" /></shape></item><item android:state_checked="true"><shape><solid android:color="@color/wyze_color_00D0B9" /><corners android:radius="50dp" /></shape></item>
</selector>
颜色缺失check_box_text_color.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"><item android:color="@color/black" android:state_checked="false" /><item android:color="@color/white" android:state_checked="true" />
</selector>
看下方法二
同上操作
方法二xml代码如下
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"android:layout_width="match_parent"android:layout_height="80dp"><CheckBoxandroid:id="@+id/tv1"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="S"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintEnd_toStartOf="@+id/tv2"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toStartOf="parent"app:layout_constraintTop_toTopOf="parent" /><CheckBoxandroid:id="@+id/tv2"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="M"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="@+id/tv1"app:layout_constraintEnd_toStartOf="@+id/tv3"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv1"app:layout_constraintTop_toTopOf="@+id/tv1" /><CheckBoxandroid:id="@+id/tv3"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="T"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="@+id/tv2"app:layout_constraintEnd_toStartOf="@+id/tv4"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv2"app:layout_constraintTop_toTopOf="@+id/tv2" /><CheckBoxandroid:id="@+id/tv4"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="W"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="@+id/tv3"app:layout_constraintEnd_toStartOf="@+id/tv5"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv3"app:layout_constraintTop_toTopOf="@+id/tv3" /><CheckBoxandroid:id="@+id/tv5"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="T"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="@+id/tv4"app:layout_constraintEnd_toStartOf="@+id/tv6"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv4"app:layout_constraintTop_toTopOf="@+id/tv4" /><CheckBoxandroid:id="@+id/tv6"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="F"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="@+id/tv5"app:layout_constraintEnd_toStartOf="@+id/tv7"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv5"app:layout_constraintTop_toTopOf="@+id/tv5" /><CheckBoxandroid:id="@+id/tv7"android:layout_width="40dp"android:layout_height="40dp"android:background="@drawable/check_box_bg"android:button="@null"android:gravity="center"android:text="S"android:textAllCaps="true"android:textColor="@color/check_box_text_color"app:layout_constraintBottom_toBottomOf="@+id/tv6"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.5"app:layout_constraintStart_toEndOf="@+id/tv6"app:layout_constraintTop_toTopOf="@+id/tv6" />
</androidx.constraintlayout.widget.ConstraintLayout>
GitHub源码查看:源码查看
约束布局Google官方API:官方文档ConstraintLayout
Google官方微信技术博客:约束布局性能介绍
Google官方文档说明:文档直达
Android开发之约束布局平均分布|ConstraintLayout平均分布|约束布局均匀分布|ConstraintLayout均匀分布相关推荐
- Android开发笔记(一百三十六)可折叠工具栏布局CollapsingToolbarLayout
可折叠工具栏布局CollapsingToolbarLayout 上一篇博文< Android开发笔记(一百三十五)应用栏布局AppBarLayout>阐述了如何把Toolbar往上滚动,那 ...
- Android开发笔记(一百三十五)应用栏布局AppBarLayout
应用栏布局AppBarLayout Android5.0推出工具栏Toolbar用来替代ActionBar,灵活性和易用性大大增强,有关Toolbar的详细介绍参见< Android开发笔记(一 ...
- Android开发中EditText获得焦点弹出输入框改变屏幕布局的问题
在Android开发中,比较头疼的问题就是EditText总是已启动就获得焦点并弹出输入框,感觉很是不爽.而且,因为输入框的弹出,导致屏幕布局获得改变,有些空间被挤压到一起,很是难看,所以,我就上网搜 ...
- Android开发笔记(一百三十八)文本输入布局TextInputLayout
文本输入布局TextInputLayout TextInputLayout是MaterialDesign库中对编辑框EditText进行增强的一个控件.众所周知,EditText未输入字符时,我们可以 ...
- Android开发笔记(一百二十三)下拉刷新布局SwipeRefreshLayout
SwipeRefreshLayout 下拉刷新布局SwipeRefreshLayout是Android又一与时俱进的控件,顾名思义它随着用户手势向下滑动就会触发刷新操作.从实际的下拉效果来看,Swip ...
- Android开发笔记(一百二十)两种侧滑布局
SlidingPaneLayout SlidingPaneLayout是Android在android-support-v4.jar中推出的一个可滑动面板的布局,在前面< Android开发笔记 ...
- android开发时华为手机底部导航栏挡住了应用布局
原因:使用安卓的BottomNavigationView控件开发底部导航栏同时使用了沉浸式状态栏导致华为手机的底部导航栏会盖住我应用的导航栏. 解决:先写一个工具类 import android.co ...
- Android开发(十八)——头部、中部、底部布局技巧
头部.中部.尾部布局涉及到布局内容自适应,总结两个技巧: 第一种相对布局: <?xml version="1.0" encoding="utf-8"?&g ...
- Android开发知识(二十二)LayoutInflater装载xml布局过程的源码解析
文章目录 前言 LayoutInflater实例 LayoutInflater的装载过程 include 标签解析 merge 标签解析 attachToRoot参数解析 View创建过程 (1)判断 ...
- android addview指定位置,Android开发中,请问当在一个视图中addView另一个布局视图时为什么报错?...
Android开发中,我在一个视图中addView另一个布局视图(该视图通过inflate加载获得,其中root为null即没有附加parent视图),为什么还是会报错误: The specified ...
最新文章
- C# WINFORM 自定义窗体 皮肤[转]
- mysql 报错10614_golang使用go-sql-driver实现mysql增删改操作-Go语言中文社区
- linux系统之编译安装mysql
- 在路上---学习篇(一)Python 数据结构和算法 (4) --希尔排序、归并排序
- 对RESTful Web API的理解与设计思路
- VLC视频播放器原理详细分析含TS流格式分析
- java中CardLayout的使用方法
- 先来先服务算法、运行时间最短者优先算法和最高响应比优先调度算法_Linux进程调度:完全公平调度器CFS
- 安全问题汇总(二) SlowHttp 慢速攻击防护
- 【架构师面试题库1】—etcd高可用集群搭建
- 电脑开机时光驱咔咔响_电脑机箱噪音大?看懂这篇内容,让你四步就能解决问题...
- collections.OrderedDict()
- 帆软 JS给填报控件(单元格)赋值 包含扩展单元格赋值
- Kafka从上手到实践 - 实践真知:Kafka Java Producer | 凌云时刻
- eclipse合并svn分支方法
- java中this什么时候不能省略?this()的用法
- 大学生如何自学PR剪辑以及PS教程?
- INS 图片/视频保存
- 怎么把在线网站保存的flv格式转换成mp4
- 短信验证码和语音验证码的对比
热门文章
- 计算机与技术卓越信息技术,2018版计算机科学与技术专业(卓越工程师)培养目标与毕业要求...
- 自己动手写CPU(3)逻辑、移位操作与空指令
- LL-verilog-HDLBitSim/circuit10解答和过程详解
- 任意整数分频(图文并茂)
- mysql恢复root用户_恢复MYSQL的root用户
- 数字ab写成c语言表达式,《C语言程序设计》复习题(21页)-原创力文档
- linux下hg无法运行_在 Windows 里也可以访问 Linux 子系统文件了
- QT_4_QpushButton的简单使用_对象树
- windows下多tomcat部署
- MVC之实体框架(数据持久化框架)EntityFrameWork(EF)