【约束布局】ConstraintLayout配合Guideline解决两个子控件其中一个被挤出屏幕的问题

news2024/11/18 22:46:37

一、需求

        屏幕横向显示文本框A和图标B,A在B的左侧,B紧贴在A的右边显示,文本框A的字数不确定,文本框A的字数足够多时,换行显示,并且保证图标B一直在文本框A的右侧,且不被挤出屏幕。

二、问题

        本来以为是一个很简单的需求,直接用LinearLayout布局,horizontal横向,因为文本框的长度不确定,所以设置weight权重比例是不合适的。自适应横向排列的话,文本框字数太多就会把后面的图标挤出父布局看不到。还有一个想法,就是TextView设置drawableEnd属性,这种方法是可行的,不过也有弊端,那就是无法控制图标的大小,在不同分辨率的设备上,图标的大小会显示的很不适配。

三、解决问题

上面的问题解决的话,方法是比较多,不过需要嵌套布局或者多写一些代码,我觉得最合适的方案,还是使用约束布局ConstraintLayout及其相关的布局和属性来解决。涉及到的布局、属性如下:

  1. app:layout_constrainedWidth="true",让控件的宽度受到约束
  2. Guideline,利用参考线,让后面的ImageView保持在参考线左侧
  3. app:layout_constraintHorizontal_chainStyle,设置为packed,让图标紧贴着文本框
  4. app:layout_constraintHorizontal_bias,横向偏移设置为0,让整体从父布局左边开始

四、代码

  <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="@dimen/dp_120"
        android:layout_height="match_parent">
        <TextView
            android:id="@+id/tv_labelAndName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:ellipsize="end"
            android:lineSpacingMultiplier="0.8"
            android:maxLines="2"
            android:textColor="@color/color_111111"
            android:textSize="@dimen/sp_14"
            app:layout_constrainedWidth="true"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@id/img_sex"
            app:layout_constraintHorizontal_bias="0"
            app:layout_constraintHorizontal_chainStyle="packed"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            tools:text="0000000002床 特靠谱" />

        <ImageView
            android:id="@+id/img_sex"
            android:layout_width="@dimen/dp_12"
            android:layout_height="@dimen/dp_12"
            android:src="@mipmap/ic_sex_male"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toStartOf="@id/guideline"
            app:layout_constraintStart_toEndOf="@id/tv_labelAndName"
            app:layout_constraintTop_toTopOf="parent" />

        <androidx.constraintlayout.widget.Guideline
            android:id="@+id/guideline"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            app:layout_constraintGuide_percent="1" />
    </androidx.constraintlayout.widget.ConstraintLayout>

关键代码:

1,TextView

           //让TextView的宽度受到整体的约束,会给ImageView留位置,不把后者挤出去

            app:layout_constrainedWidth="true"

            //让TextView保持在ImageView的左边
            app:layout_constraintEnd_toStartOf="@id/img_sex"

            //TextView开头的链,横向偏移量为0,也就是从父控件的最左端开始
            app:layout_constraintHorizontal_bias="0"

            //将TextView、ImageView设为链,并且是紧贴在一起的
            app:layout_constraintHorizontal_chainStyle="packed"

2,ImageView

            //让ImageView保持在参考线Guideline左侧,这样才能保证不被挤出父布局外面
            app:layout_constraintEnd_toStartOf="@id/guideline"

            //让ImageView保持在TextView右侧
            app:layout_constraintStart_toEndOf="@id/tv_labelAndName"

3,Guideline

            //定义参考线的方向,是垂直方向的参考线

            android:orientation="vertical"

            //定义参考线相对父控件的位置,距离父控件起始位置的百分比。因为我们定义了垂直参考线,那么就是距离父控件左端的百分比。0.0表示在父控件最左端无偏移,1表示在父控件的最右端,完全偏移。
            app:layout_constraintGuide_percent="1" 

调试效果:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1089120.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Java Object转String方式

Map<String,Object> map new HashMap<>(); map.put("a1","a"); map.put("a2",""); map.put("a3",1); map.put("a4",null);一、强制转换 value "a"或""可以进行强制转换String…

众佰诚:新手开抖音小店申请流程是什么

抖音小店为抖音平台上的商家提供了一个全新的销售渠道&#xff0c;让更多创业者能够轻松实现线上销售。如果你是一位希望在抖音上开展电商业务的新手&#xff0c;下面将为你详细介绍如何申请开通抖音小店。 一、准备工作 首先&#xff0c;你需要准备好以下材料&#xff1a; 营业…

数学术语之源——代数——(子空间的)直和(direct sum)

1. 关于(子空间的)直和(direct sum)的较正式定义 令 为向量空间 的子空间,若 且 是独立的&#xff0c;则称 是子空间 的直和(direct sum), 记为 &#xff0c; 这种表示在同一个基的前提下是唯一的。 一个直观几何类比理解(个人愚见)&#xff1a;如果我将向量空间V 看…

计算机基础——内存

文章目录 内存一、内存条、总线、DMA二、内存管理1、为什么要有逻辑地址2、逻辑地址和物理地址如何映射3、分页时间和空间优化4、程序内部的内存管理-分段 三、内存相关的系统调用1、用户态和内核态 四、Java内存 内存 提示&#xff1a;这里可以添加本文要记录的大概内容&…

JS+Jquery用法

1. 当存在多个select时&#xff0c;想要获取每一个select的选中的值(使用变量赋值的方法). var Metric "";$(#Metric).change(function () {Metric $(this).children("option:selected").val();console.log("Metric:" Metric);}); 2. 在页面…

海外代理IP与VPN有何区别?哪个更好?

当谈到网络安全和IP变更时&#xff0c;人们会想到VPN和IP代理服务器。很多人很困惑&#xff0c;它们之间有什么区别&#xff0c;应该选择哪一个呢&#xff1f;这取决于您的需求来决定哪一个更好。 一、什么是VPN与IP代理&#xff1f; VPN 是虚拟专用网络 (Virtual Private Net…

ACP.项目管理.5种复盘会议

复盘要怎么做的有水准&#xff0c;让领导满意&#xff0c;方式方法很重要。今天给你们安利5种复盘方法&#xff0c;保准你省事&#xff0c;领导还满意。 一、KPT复盘法 7月份年中一直在做和复盘相关的事&#xff0c;像公司的OKR复盘、年中战略规划&#xff0c;不过日常很多生…

Hadoop 安装教程 (Mac m1/m2版)

安装JDK1.8 这里最好是安装1.8版本的jdk 1. 进入官网Java Downloads | Oracle Hong Kong SAR, PRC,下滑到中间区域找到JDK8 2.选择mac os,下载ARM64 DMG Installer对应版本 注&#xff1a;这里下载需要注册oracle账号&#xff0c;不过很简单&#xff0c;只需要提供邮箱即可&…

【C++】模板进阶 -- 详解

一、非类型模板参数 模板参数 分类类型形参与非类型形参。 类型形参&#xff0c;即出现在模板参数列表中&#xff0c;跟在 class 或者 typename 之类的参数类型名称。 非类型形参&#xff0c;就是用一个常量作为类&#xff08;函数&#xff09;模板的一个参数&#xff0c;在类…

基于SSM的毕业生就业管理平台设计与实现

末尾获取源码 开发语言&#xff1a;Java Java开发工具&#xff1a;JDK1.8 后端框架&#xff1a;SSM 前端&#xff1a;采用JSP技术开发 数据库&#xff1a;MySQL5.7和Navicat管理工具结合 服务器&#xff1a;Tomcat8.5 开发软件&#xff1a;IDEA / Eclipse 是否Maven项目&#x…

2023年,考PMP用处大吗?

就本身PMP的价值而言&#xff0c;不管到多少年&#xff0c;跟新迭代下&#xff0c;用处都是很大的&#xff0c;就看你会不会用。 PMP会让你学到一套系统的项目管理的流程&#xff0c;还有作为项目管理人士该具备的素质和技能&#xff0c;这就是使得&#xff0c;即便从未接触过…

谷粒商城笔记+踩坑(25)——整合Sentinel实现流控和熔断降级

导航&#xff1a; 【Java笔记踩坑汇总】Java基础进阶JavaWebSSMSpringBoot瑞吉外卖SpringCloud黑马旅游谷粒商城学成在线MySQL高级篇设计模式常见面试题源码 SpringCloud基础5——微服务保护、Sentinel 目录 一、Sentinel概述 1.1、服务流控、熔断和降级 1.2、Sentinel 简介…

能否翻译翻译,到底什么才叫“精通Java” ?

01 模糊的岗位能力标准 技术类人员的招聘始终是令HR 与技术面试官头疼的事。 在一般招聘流程中&#xff0c;当确定了某个岗位招聘需求后&#xff0c;技术面试官会与HR 一同商讨并明确该岗位的画像。 明确画像后&#xff0c;一般HR 会负责在招聘平台书写岗位JD&#xff0c;技…

不同商家的订单详情API接口可能会有不同的实现方式,下面是一个通用的订单详情API接口的示

不同商家的订单详情API接口可能会有不同的实现方式&#xff0c;下面是一个通用的订单详情API接口的示例&#xff1a; 请求方式&#xff1a;使用HTTP或HTTPS协议&#xff0c;向指定URL发送GET请求&#xff0c;获取订单详情。 URL格式&#xff1a;商家订单详情API的URL通常由两部…

nginx之基于LNMP搭建论坛

LNMP&#xff1a;企业网站的应用模式之一&#xff0c;早期的论坛架构就是lnmp搭建的 L&#xff1a;Linux平台&#xff0c;操作系统&#xff0c;是另外三个组件的运行平台 N&#xff1a;nginx&#xff0c;提供静态页面 M&#xff1a;mysql&#xff0c;数据库&#xff0c;开元…

【一些理解】搜广推:推荐、广告、搜索算法的区别、入坑?

【一些理解】搜广推&#xff1a;推荐、广告、搜索算法的区别、入坑&#xff1f; 文章目录 【一些理解】搜广推&#xff1a;推荐、广告、搜索算法的区别、入坑&#xff1f;1. 根本区别2. 目标上的区别3. 模型上的区别4. 辅助策略和算法上的区别参考 作为互联网的核心应用“搜广推…

计算机的字符与编码集

文章目录 前言一、字符编码集的历史1.ASCII码2.Extended ASCII码3.字符编码集的国际化 二、中文编码集 前言 今天给大家介绍计算机的字符与编码集&#xff0c;分为两部分&#xff1a;字符编码集的历史、中文编码集。 一、字符编码集的历史 这部分包含三个板块内容&#xff1a…

【特纳斯电子】基于物联网的空气质量检测-实物设计

视频及资料链接&#xff1a;基于物联网的空气质量检测-实物设计 - 电子校园网 (mcude.com) 编号&#xff1a; T0082203M-SW 设计简介&#xff1a; 本设计是基于物联网的空气质量检测系统&#xff0c;主要实现以下功能&#xff1a; 1.通过OLED显示模式、温度、湿度、PM2.5、…

【Java】查找jdk步骤

需求描述 解决方法 第一步 第二步 第三步 第四步 参考文章

自定义jenkins镜像提示FontConfiguration.head错误

系统使用&#xff1a;Debian12&#xff0c;jdk17 提示问题&#xff1a;缺少字体 找一台jdk8的环境&#xff0c;在lib文件夹中找到fontconfig.bfc find / -name *fontconfig* 复制到jenkins目标服务器中&#xff0c;jdk目录的lib中 再次启动jenkins服务正常