ConstraintLayout使用中遇到的问题:同一行内的两个Textview,第二个被挤出屏幕的解决方案

本文主要是介绍ConstraintLayout使用中遇到的问题:同一行内的两个Textview,第二个被挤出屏幕的解决方案,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

遇到的一个问题:
同一行的两个Textview,要实现两个View连着,前一个view的内容长度不确定,过长的时候会导致第二个view被挤出屏幕外,使用LinearLayout也会出现这种情况。

这里提供一个解决方案:
借助于辅助线,和

app:layout_constrainedHeight表示是否约束height,相应的也有app:layout_constrainedWidth
*
app:layout_constraintVertical_bias表示作用于链头第一个子控件,通过设置值0~1控制头尾间距比例(偏移比例)

这里贴上一个拖拽UI的界面图。
在这里插入图片描述
垂直方向,借助于3条垂直辅助线。从左至右,后续依次称为,guideline1,guideline2, guideline3。两个textview依次称为t1,t2。

要实现t2紧跟t1,则t2左侧的依赖关系就要依赖于t1的右侧,当文字内容较短的时候,t2可以实现紧跟t1。
但当t1文字内容过长,就会把t2顶出屏幕外。
但是这个时候t2是紧贴屏幕右侧的
往往我们都需要t2右侧有一定的间距
在这里插入图片描述
如上图,t2与第二条辅助线右侧建立关系。此时不存在guideline2,这事就会出现t1过长直接把t2挤出去的情况。
因为t2的左侧已经和t1的右侧建立了关系,这个时候t1的右侧已经不能再与t2的左侧建立关系。这时,我们添加一条辅助线guideline2。
让t1的右侧与guideline2建立关系。但是这个时候,当t1文字过长的时候,不会再将t2挤出屏幕外了,但是会覆盖住t2。

这个时候给t1 加入app:layout_constrainedWidth=true,这个属性,可以防止t2被覆盖。

但是还有一个问题,t1上下左右全部加入了依赖关系,当文字内容过短的时候,文字出现了居中的现象,这显然不是我们想要的效果。
这时候,就需要引入app:layout_constraintHorizontal_bias=“0.0”,让t1居左显示(1.0是居右显示)

最后附上代码(虽说是界面化操作,但是有的时候界面和代码同时使用能更好的解决问题):

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns: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:id="@+id/nim_pop_notice_layout"android:layout_width="match_parent"android:layout_height="wrap_content"><android.support.constraint.Guidelineandroid:id="@+id/guideline21"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="vertical"app:layout_constraintGuide_end="88dp" /><android.support.constraint.Guidelineandroid:id="@+id/guideline3"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="vertical"app:layout_constraintGuide_end="37dp" /><android.support.constraint.Guidelineandroid:id="@+id/guideline2"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="vertical"app:layout_constraintGuide_begin="37dp" /><android.support.constraint.Guidelineandroid:id="@+id/guideline4"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="horizontal"app:layout_constraintGuide_begin="52dp" /><TextViewandroid:id="@+id/vx_content"android:layout_width="wrap_content"android:layout_height="wrap_content"android:ellipsize="end"android:gravity="center_vertical"android:includeFontPadding="false"android:maxLines="1"android:text="@string/vx_content"android:textColor="@color/black_333333"android:textSize="@dimen/common_title_size16"app:layout_constrainedWidth="true"app:layout_constraintBottom_toTopOf="@+id/guideline5"app:layout_constraintEnd_toStartOf="@+id/guideline21"app:layout_constraintHorizontal_bias="0.0"app:layout_constraintStart_toStartOf="@+id/guideline2"app:layout_constraintTop_toTopOf="@+id/guideline4" /><TextViewandroid:id="@+id/vx_change"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_gravity="center_vertical"android:layout_marginStart="26dp"android:includeFontPadding="false"android:singleLine="true"android:text="@string/vx_change"android:textColor="@color/color_2d7eff"android:textSize="@dimen/common_title_size12"app:layout_constraintHorizontal_bias="0.0"app:layout_constraintBottom_toTopOf="@+id/guideline5"app:layout_constraintEnd_toStartOf="@+id/guideline3"app:layout_constraintStart_toEndOf="@+id/vx_content"app:layout_constraintTop_toTopOf="@+id/guideline4" /><android.support.constraint.Guidelineandroid:id="@+id/guideline5"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="horizontal"app:layout_constraintGuide_begin="74dp" /><ImageViewandroid:id="@+id/seven_iv"android:layout_width="wrap_content"android:layout_height="wrap_content"android:contentDescription="TODO"android:paddingTop="@dimen/common_size_5"android:paddingBottom="@dimen/common_size_5"android:src="@drawable/nochoice_squareicon"app:layout_constraintStart_toStartOf="@+id/guideline2"app:layout_constraintTop_toTopOf="@+id/guideline7" /><TextViewandroid:id="@+id/seven_tv"android:layout_width="wrap_content"android:layout_height="wrap_content"android:includeFontPadding="false"android:paddingStart="8dp"android:paddingTop="@dimen/common_size_5"android:paddingBottom="@dimen/common_size_5"android:text="@string/seven_day_not_notice"android:textColor="@color/grey_999999"android:textSize="12sp"app:layout_constraintStart_toEndOf="@+id/seven_iv"app:layout_constraintTop_toTopOf="@+id/guideline7" /><android.support.constraint.Groupandroid:id="@+id/group"android:layout_width="wrap_content"android:layout_height="wrap_content"app:constraint_referenced_ids="seven_tv,seven_iv" /><android.support.constraint.Guidelineandroid:id="@+id/guideline7"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="horizontal"app:layout_constraintGuide_begin="97dp" /><android.support.constraint.Guidelineandroid:id="@+id/guideline15"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="horizontal"app:layout_constraintGuide_begin="113dp" /><android.support.constraint.Guidelineandroid:id="@+id/guideline16"android:layout_width="wrap_content"android:layout_height="wrap_content"android:orientation="horizontal"app:layout_constraintGuide_begin="136dp" /></android.support.constraint.ConstraintLayout>

这篇关于ConstraintLayout使用中遇到的问题:同一行内的两个Textview,第二个被挤出屏幕的解决方案的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1071697

相关文章

Python中注释使用方法举例详解

《Python中注释使用方法举例详解》在Python编程语言中注释是必不可少的一部分,它有助于提高代码的可读性和维护性,:本文主要介绍Python中注释使用方法的相关资料,需要的朋友可以参考下... 目录一、前言二、什么是注释?示例:三、单行注释语法:以 China编程# 开头,后面的内容为注释内容示例:示例:四

Redis出现中文乱码的问题及解决

《Redis出现中文乱码的问题及解决》:本文主要介绍Redis出现中文乱码的问题及解决,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录1. 问题的产生2China编程. 问题的解决redihttp://www.chinasem.cns数据进制问题的解决中文乱码问题解决总结

Go语言数据库编程GORM 的基本使用详解

《Go语言数据库编程GORM的基本使用详解》GORM是Go语言流行的ORM框架,封装database/sql,支持自动迁移、关联、事务等,提供CRUD、条件查询、钩子函数、日志等功能,简化数据库操作... 目录一、安装与初始化1. 安装 GORM 及数据库驱动2. 建立数据库连接二、定义模型结构体三、自动迁

ModelMapper基本使用和常见场景示例详解

《ModelMapper基本使用和常见场景示例详解》ModelMapper是Java对象映射库,支持自动映射、自定义规则、集合转换及高级配置(如匹配策略、转换器),可集成SpringBoot,减少样板... 目录1. 添加依赖2. 基本用法示例:简单对象映射3. 自定义映射规则4. 集合映射5. 高级配置匹

Spring 框架之Springfox使用详解

《Spring框架之Springfox使用详解》Springfox是Spring框架的API文档工具,集成Swagger规范,自动生成文档并支持多语言/版本,模块化设计便于扩展,但存在版本兼容性、性... 目录核心功能工作原理模块化设计使用示例注意事项优缺点优点缺点总结适用场景建议总结Springfox 是

嵌入式数据库SQLite 3配置使用讲解

《嵌入式数据库SQLite3配置使用讲解》本文强调嵌入式项目中SQLite3数据库的重要性,因其零配置、轻量级、跨平台及事务处理特性,可保障数据溯源与责任明确,详细讲解安装配置、基础语法及SQLit... 目录0、惨痛教训1、SQLite3环境配置(1)、下载安装SQLite库(2)、解压下载的文件(3)、

使用Python绘制3D堆叠条形图全解析

《使用Python绘制3D堆叠条形图全解析》在数据可视化的工具箱里,3D图表总能带来眼前一亮的效果,本文就来和大家聊聊如何使用Python实现绘制3D堆叠条形图,感兴趣的小伙伴可以了解下... 目录为什么选择 3D 堆叠条形图代码实现:从数据到 3D 世界的搭建核心代码逐行解析细节优化应用场景:3D 堆叠图

全面解析MySQL索引长度限制问题与解决方案

《全面解析MySQL索引长度限制问题与解决方案》MySQL对索引长度设限是为了保持高效的数据检索性能,这个限制不是MySQL的缺陷,而是数据库设计中的权衡结果,下面我们就来看看如何解决这一问题吧... 目录引言:为什么会有索引键长度问题?一、问题根源深度解析mysql索引长度限制原理实际场景示例二、五大解决

Springboot如何正确使用AOP问题

《Springboot如何正确使用AOP问题》:本文主要介绍Springboot如何正确使用AOP问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录​一、AOP概念二、切点表达式​execution表达式案例三、AOP通知四、springboot中使用AOP导出

Python中Tensorflow无法调用GPU问题的解决方法

《Python中Tensorflow无法调用GPU问题的解决方法》文章详解如何解决TensorFlow在Windows无法识别GPU的问题,需降级至2.10版本,安装匹配CUDA11.2和cuDNN... 当用以下代码查看GPU数量时,gpuspython返回的是一个空列表,说明tensorflow没有找到