【约束布局】ConstraintLayout 组件可见性 View.GONE 处理 与 Margin 属性 ( 约束布局可见性处理 | goneMargin 属性 )
2024-04-29 08:29:45
文章目录
- I . 相对定位 Margin 属性
- II . 可见性改变后的行为处理 ( Visibility Behavior )
- III . 组件设置 GONE 属性示例
- 被 约束到不可见组件 后 Margin 属性 表现
- IV . goneMargin 属性示例
- V . 相关资源代码
I . 相对定位 Margin 属性
相对定位 Margin 简介 :
- 1.Margin 作用对象 : 如果某一边对应的 Margin 属性被设置 , 这些 Margin 会被应用于对应的约束 ;
- 2.Margin 作用效果 : 设置 Margin 属性会强制在 被约束的边 ( 源边 Source Side ) 和 约束到的位置 之间 填充指定尺寸的空间 ;
- 3.Margin 属性类型及取值范围 : Margin 属性值是尺寸类型 , 设置 dip , px 等数值属性 , 其值必须大于等于0 ;
- 4.常用的相对定位 Margin 属性 :
//左侧边的空白
android:layout_marginStart
//右侧边的空白
android:layout_marginEnd//左侧边的空白
android:layout_marginLeft
//右侧边的空白
android:layout_marginRight//顶部边的空白
android:layout_marginTop
//底部边的空白
android:layout_marginBottom
II . 可见性改变后的行为处理 ( Visibility Behavior )
约束布局 组件 可见性说明 :
- 1.讨论情况 : 约束布局中 , 当组件被设置成 View.GONE 可见性时 , 针对该组件的处理方式 ;
- 2.通常处理方案 ( 其它布局 ) : 被设置成 View.GONE 属性的组件 , 一般情况下进行如下处理 :
- ① 取消显示 : 首先其先取消显示 ;
- ② 布局移除 : 然后将该组件从布局中移除 ;
- ③ 尺寸不变 : 但组件的实际的尺寸不会被修改 ;
- 3.约束布局消失的组件处理方式 :
- ① 取消显示 : 该组件消失 , 不可见 ;
- ② 布局保留 : 该组件仍然是布局中的一部分 ;
- ③ 尺寸修改 : 该组件的宽高尺寸会被设置成 0 , 即 该组件收缩成一个点 ;
- ④ 约束保留 : 该组件 四个方向的约束 仍然有效 , 其所在位置不会改变 ;
- ⑤ Margin 置 0 : 该组件所有方向的 Margin 属性都被设置成 0 ; 即 下面 的 6 种 Margin 属性清零 ;
layout_goneMarginStart
layout_goneMarginEnd
layout_goneMarginLeft
layout_goneMarginTop
layout_goneMarginRight
layout_goneMarginBottom
III . 组件设置 GONE 属性示例
组件设置 GONE 属性 改变示例 :
- 1.布局示例 : 该布局中 , 含有约束组件和被约束组件 , 代码如下 :
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"tools:layout_editor_absoluteY="25dp"><!--被 约束 的组件该组件 垂直方向 居中于整体布局其左侧 紧贴 目标组件 , 右侧约束于 父容器--><Buttonandroid:id="@+id/button1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="被约束组件"app:layout_constraintStart_toEndOf="@+id/button"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"app:layout_constraintTop_toTopOf="parent"app:layout_constraintBottom_toBottomOf="parent" /><!--约束 到的 目标组件该组件 垂直方向 居中于整体布局其左侧紧贴布局左边缘 , 但是有 50dip 的边距 Margin如果该组件设置不可见 , 就会变成一个点 , 其 50dip 的边距也会消失如果设置了 layout_goneMarginLeft 属性 , 其消失状态下 , 该边距有效--><Buttonandroid:id="@+id/button"android:layout_width="188dp"android:layout_height="188dp"android:text="目标组件"android:visibility="visible"app:layout_constraintStart_toStartOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"android:layout_marginLeft="50dip"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintTop_toTopOf="parent"app:layout_constraintVertical_bias="0.5" /></android.support.constraint.ConstraintLayout>
- 2.布局截图 :
- 3.布局说明 :
- ① 目标组件 : 该组件的 android:visibility 属性稍后会被设置 View.GONE;
- 1> 垂直方向 : 居中于布局 ;
- 2> 水平方向 : 其约束与父容器左右 , Bias 属性为 0 , 因此其紧贴左侧 , 由于设置了 layout_marginLeft 属性 为 50dip , 其组件的左侧 举例 父容器左边缘有 50dip 的空隙 ;
- ② 被约束组件 : 该组件 被约束与目标组件 , 主要是查看 目标组件消失后 , 其被约束的状况 ;
- 1> 垂直方向 : 居中于布局 ;
- 2> 水平方向 : 其左侧 约束与 目标组件右侧 , 其右侧约束与父容器右侧 , Bias 属性为 0 , 因此 其紧贴 目标组件的右侧 ;
- ① 目标组件 : 该组件的 android:visibility 属性稍后会被设置 View.GONE;
- 4.设置目标组件 GONE 属性 :
android:visibility="visible"
- 5.设置 GONE 属性后代码 : 与上面的代码唯一不同就是 button 组件 ( 目标组件 ) 可见性被设置成了 GONE ;
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"tools:layout_editor_absoluteY="25dp"><!--被 约束 的组件该组件 垂直方向 居中于整体布局其左侧 紧贴 目标组件 , 右侧约束于 父容器--><Buttonandroid:id="@+id/button1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="被约束组件"app:layout_constraintStart_toEndOf="@+id/button"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"app:layout_constraintTop_toTopOf="parent"app:layout_constraintBottom_toBottomOf="parent" /><!--约束 到的 目标组件该组件 垂直方向 居中于整体布局其左侧紧贴布局左边缘 , 但是有 50dip 的边距 Margin如果该组件设置不可见 , 就会变成一个点 , 其 50dip 的边距也会消失如果设置了 layout_goneMarginLeft 属性 , 其消失状态下 , 该边距有效--><Buttonandroid:id="@+id/button"android:layout_width="188dp"android:layout_height="188dp"android:text="目标组件"android:visibility="gone"app:layout_constraintStart_toStartOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"android:layout_marginLeft="50dip"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintTop_toTopOf="parent"app:layout_constraintVertical_bias="0.5" /></android.support.constraint.ConstraintLayout>
- 6.组件设置 GONE 属性布局截图 :
- 7.组件设置 GONE 属性后的说明 :
- ① 可见性与宽高 : 目标组件仍然在布局中存在 , 只是变成了一个点 , 宽高变成 0 , 不可见 ;
- ② 约束存在 : 目标组件的约束仍然有效 , 垂直方向上 , 仍然居中 , 水平方向紧贴左侧 , 符合约束设置 ;
- ③ Margin 清零 : 左侧 Margin 被设置成了 0dip , 原来的值是 50dip , 组件消失后 , 其值变成 0 ;
被 约束到不可见组件 后 Margin 属性 表现
当 被约束组件的某位置 ( Left, Right, Top, Bottom ) 被 约束到的目标组件可见性 ( Visibility ) 是 View.GONE 时 , 可以使用下面的属性值 , 设置一个不同的 Margin 属性值 ;
layout_goneMarginStart
layout_goneMarginEnd
layout_goneMarginLeft
layout_goneMarginTop
layout_goneMarginRight
layout_goneMarginBottom
注意 : 该属性是设置给 可见组件的 , 当该组件被约束到的组件不可见时 , 该属性生效 ;
IV . goneMargin 属性示例
goneMargin 属性示例 :
- 1.目标组件可见时 代码 :
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"tools:layout_editor_absoluteY="25dp"><!--被 约束 的组件该组件 垂直方向 居中于整体布局其左侧 紧贴 目标组件 , 右侧约束于 父容器--><Buttonandroid:id="@+id/button1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="被约束组件"app:layout_goneMarginLeft="50dip"app:layout_constraintStart_toEndOf="@+id/button"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"app:layout_constraintTop_toTopOf="parent"app:layout_constraintBottom_toBottomOf="parent" /><!--约束 到的 目标组件该组件 垂直方向 居中于整体布局其左侧紧贴布局左边缘 , 但是有 50dip 的边距 Margin如果该组件设置不可见 , 就会变成一个点 , 其 50dip 的边距也会消失如果设置了 layout_goneMarginLeft 属性 , 其消失状态下 , 该边距有效--><Buttonandroid:id="@+id/button"android:layout_width="188dp"android:layout_height="188dp"android:text="目标组件"android:visibility="visible"app:layout_constraintStart_toStartOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"android:layout_marginLeft="50dip"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintTop_toTopOf="parent"app:layout_constraintVertical_bias="0.5" /></android.support.constraint.ConstraintLayout>
- 2.目标组件可见时 截图 :
- 3.目标组件不可见时 且 没有 goneMargin 属性时 的 代码 :
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"tools:layout_editor_absoluteY="25dp"><!--被 约束 的组件该组件 垂直方向 居中于整体布局其左侧 紧贴 目标组件 , 右侧约束于 父容器--><Buttonandroid:id="@+id/button1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="被约束组件"app:layout_constraintStart_toEndOf="@+id/button"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"app:layout_constraintTop_toTopOf="parent"app:layout_constraintBottom_toBottomOf="parent" /><!--约束 到的 目标组件该组件 垂直方向 居中于整体布局其左侧紧贴布局左边缘 , 但是有 50dip 的边距 Margin如果该组件设置不可见 , 就会变成一个点 , 其 50dip 的边距也会消失如果设置了 layout_goneMarginLeft 属性 , 其消失状态下 , 该边距有效--><Buttonandroid:id="@+id/button"android:layout_width="188dp"android:layout_height="188dp"android:text="目标组件"android:visibility="gone"app:layout_constraintStart_toStartOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"android:layout_marginLeft="50dip"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintTop_toTopOf="parent"app:layout_constraintVertical_bias="0.5" /></android.support.constraint.ConstraintLayout>
- 4.目标组件不可见时 且 没有 goneMargin 属性时 的 截图 :
- 5.目标组件不可见时 且 有 goneMargin 属性时 的 代码 :
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayoutxmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:layout_width="match_parent"android:layout_height="match_parent"tools:context=".MainActivity"tools:layout_editor_absoluteY="25dp"><!--被 约束 的组件该组件 垂直方向 居中于整体布局其左侧 紧贴 目标组件 , 右侧约束于 父容器--><Buttonandroid:id="@+id/button1"android:layout_width="wrap_content"android:layout_height="wrap_content"android:text="被约束组件"app:layout_goneMarginLeft="50dip"app:layout_constraintStart_toEndOf="@+id/button"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"app:layout_constraintTop_toTopOf="parent"app:layout_constraintBottom_toBottomOf="parent" /><!--约束 到的 目标组件该组件 垂直方向 居中于整体布局其左侧紧贴布局左边缘 , 但是有 50dip 的边距 Margin如果该组件设置不可见 , 就会变成一个点 , 其 50dip 的边距也会消失如果设置了 layout_goneMarginLeft 属性 , 其消失状态下 , 该边距有效--><Buttonandroid:id="@+id/button"android:layout_width="188dp"android:layout_height="188dp"android:text="目标组件"android:visibility="gone"app:layout_constraintStart_toStartOf="parent"app:layout_constraintEnd_toEndOf="parent"app:layout_constraintHorizontal_bias="0.0"android:layout_marginLeft="50dip"app:layout_constraintBottom_toBottomOf="parent"app:layout_constraintTop_toTopOf="parent"app:layout_constraintVertical_bias="0.5" /></android.support.constraint.ConstraintLayout>
- 6.目标组件不可见时 且 有 goneMargin 属性时 的 截图 :
V . 相关资源代码
相关代码地址 :
- 1.GitHub 项目展示地址 : UI_Demos_4_CSDN_Blog
- 2.本博客相关代码地址 :
- ① 目标组件可见时 且 没有 goneMargin 属性时 的 代码 : activity_gone_behavior_visibile.xml
- ② 目标组件不可见时 且 没有 goneMargin 属性时 的 代码 : activity_gone_behavior_gone.xml
- ③ 目标组件可见时 且 有 goneMargin 属性时 的 代码 : activity_gone_behavior_gone_margin_visible.xml
- ④ 目标组件不可见时 且 有 goneMargin 属性时 的 代码 : activity_gone_behavior_gone_margin_gone.xml
【约束布局】ConstraintLayout 组件可见性 View.GONE 处理 与 Margin 属性 ( 约束布局可见性处理 | goneMargin 属性 )相关推荐
- 约束布局ConstraintLayout
文章目录 一,背景 二,控件优点 三,项目中引入 四,基本使用 4.1 相对位置 4.2 尺寸约束 4.3 宽高比 Ratio 4.4 百分比宽高 Percent 4.5 偏移量 bias 4.6 圆 ...
- 约束布局ConstraintLayout加快布局速度
Android Studio2.2更新布局设计器,同时,引人了约束布局ConstraintLayout. 简单来说,可以把它看做是相对布局的升级版本,但是区别与相对布局更加强调约束.何为约束,即控件之 ...
- 约束布局ConstraintLayout（官翻篇）
目录 ConstraintLayout Relative positioning 相对定位 Margins 间距 当关联的控件可见性是GONE的时候 Centering positioning and ...
- 约束布局ConstraintLayout看这一篇就够了
目录 1.介绍 2.为什么要用ConstraintLayout 3.如何使用ConstraintLayout 3.1 添加依赖 3.2 相对定位 3.3 角度定位 3.4 边距 3.5 居中和偏移 3 ...
- Android开发笔记（一百四十九）约束布局ConstraintLayout
约束布局ConstraintLayout是Android Studio 2.2推出的新布局,并从Android Studio 2.3开始成为默认布局文件的根布局,由此可见Android官方对其寄予厚望 ...
- Android ：约束布局ConstraintLayout 之 Chains 链式约束
ConstraintLayout Chains 链式约束 1. 链 简介 ( 1 ) Chains ( 链 ) 简介 2. 创建 链 及 分析 生成的代码 ( 1 ) 创建水平链 ( 2 ) 链创建后 ...
- 约束布局 ConstraintLayout 的使用
目录 前言 1.将ConstraintLayout添加到项目中 2.基本规则 3.示例讲解 3.1居中对齐 3.2 排列 3.3引导线Guideline 3.4计算器示例 3.5宽高比示例 3.6Ch ...
- Android第二讲笔记（约束布局ConstraintLayout）
目录 为什么要使用约束布局ConstraintLayout? 约束布局基本属性 约束布局简单使用方法 示例 示例一(仿QQ消息) 示例二(仿微信登陆界面) 示例三(仿QQ音乐界面) 补充 写在最后 S ...
- android java与界面的关联_Android Studio安卓学习笔记(三)Android用户界面的设计布局与组件(一)用户界面布局设计(1)...
当我们创建了一个安卓项目后,我们会发现真正建立一个完善的安卓项目并不是想象的那么容易.其实和设计GUI可视化界面一样,开发安卓也需要考虑很多方面,主要考虑的还是界面布局和需要的组件. 一:Androi ...
最新文章
- 【笔记】震惊！世上最接地气的字符串浅谈(HASH+KMP)
- dropblock torch
- python编程入门经典 评分-《Python编程入门经典》--第二章：数值和运算符
- Theano深度学习入门
- 编译opencv4.2时出现undefined reference to `jpeg_default_qtables‘错误的解决方案
- Hive on Tez出现exec.Task: Failed to execute tez graph. java.lang.NullPointerException
- 当飞猪遇上 Serverless | 云原生 Talk
- 数字调色盘【RGB和16位】
- sleep期间读取所有_java并发学习第四弹：走进JDK源码去了解sleep和join
- 图的存储结构之邻接表
- 将Windows网络适配器共享网络的ip：192.168.137.1 改为其他IP
- 数独终盘生成器（调试成果）
- 云计算十字真言及其在小博无线的实践
- watir学习系列--对话框处理
- 计算机科研立项应用类题目,省级课题计算机课题题目推荐
- 禁用win10系统的Cortana小娜进程,笔记本散热风扇冷静了
- 带参数的公众号二维码 生成+后台拦截java
- java opencv 更换图片背景色（基于ROI）
- 论文翻译神器：SCITranslate 10.0，一键翻译整篇文献
- 出现NullPointerException原因