Flutter输入框换行后自适应高度

news2025/1/4 19:23:29

Flutter输入框换行后输入框高度随之增加

效果

请添加图片描述
请添加图片描述

设计思想

通过TextEditingController在build中监听输入框,输入内容后计算输入框高度然后自定义适合的值,并且改变外部容器高度达到自适应高度的目的

参考代码

//以下代码中的值只适用于案例,实际情况还需改为自己需要的实际值

//自定义输入框高度
 double inputH=25; 

 
  Widget build(BuildContext context) {
    _textEditingController.addListener(() {
      String textvalue=_textEditingController.text;
      final textStyle = TextStyle(fontSize: 16,fontWeight: FontWeight.bold);

      final textPainter = TextPainter(
        text: TextSpan(text:textvalue, style: textStyle),
        textDirection: TextDirection.ltr,
      );
      textPainter.layout(maxWidth: 260 * Global.widthX); // 减去/加上的数值根据自己需求调整,下同
      setState(() {
        if(textPainter.height<=25.0){ //只有一行的情况
          this.inputH=25.0;
        }else if(25.0<textPainter.height && textPainter.height<=95){ //大于一行小于等于4行的情况
          this.inputH=textPainter.height;
        }else if(textPainter.height>=95){ //大于四行后固定高度,输入框内容滑动展示
          this.inputH=95.0;
        }
      });
     
    });
	return Container();

}

Widget _bottom(){
 return SizedBox(
	height:inputH*Global.heightY+80*Global.heightY,
	child:Container(
		//输入框外部容器高度
		 constraints: BoxConstraints.tightFor(width: Global.screenWidth,height:inputH*Global.heightY+50*Global.heightY),
		 child: Container(
            constraints: BoxConstraints(
                maxHeight: 100.0,
                maxWidth: 265 * Global.widthX,
                minHeight: 20*Global.heightY,
                minWidth: 265 * Global.widthX),
            decoration: BoxDecoration(
              color: Colors.white,
              border: Border.all(  //边框,颜色以及宽度
                // color: Color(0xFFFCCCCCC),
                width: 1.0,
                color: Colors.black12
              ),
              borderRadius: BorderRadius.circular(10.0),
            ),
            margin: EdgeInsets.fromLTRB(9* Global.widthX, 0, 0, 0),
            padding: EdgeInsets.fromLTRB(5* Global.widthX,0, 0, 0),
            child: Center(

              child: TextField(
                // focusNode: _focusNode1,
                maxLines: null,
                // maxLength: 170,
                keyboardType: TextInputType.multiline,
                controller: _textEditingController,
                // textAlign: TextAlign.center,
                textAlignVertical: TextAlignVertical.center,
                decoration: InputDecoration.collapsed(

                  hintText: _hintText,

                ),
                
              ),
            ),
          ),
		 
	)
);
}

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

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

相关文章

深入理解快速排序算法:从原理到实现

目录 1. 引言 2. 快速排序算法原理 3. 快速排序的时间复杂度分析 4. 快速排序的应用场景 5. 快速排序的优缺点分析 5.1 优点&#xff1a; 5.2 缺点&#xff1a; 6. Java、JavaScript 和 Python 实现快速排序算法 6.1 Java 实现&#xff1a; 6.2 JavaScript 实现&#…

基于YOLOv8/YOLOv7/YOLOv6/YOLOv5的植物病害检测系统(Python+PySide6界面+训练代码)

摘要&#xff1a;开发高效的植物病害检测系统对于提升农业生产效率和作物健康管理意义重大。本篇博客详细阐述了如何运用深度学习技术构建一个植物病害检测系统&#xff0c;并提供了完整的实现代码。该系统基于先进的YOLOv8算法&#xff0c;对YOLOv7、YOLOv6、YOLOv5进行了性能…

Fisher矩阵与自然梯度法

文章目录 Fisher矩阵及自然梯度法Fisher矩阵自然梯度法总结参考链接 Fisher矩阵及自然梯度法 自然梯度法相比传统的梯度下降法具有以下优势&#xff1a; 更好的适应性&#xff1a;自然梯度法通过引入黎曼流形上的梯度概念&#xff0c;能够更好地适应参数空间的几何结构。这使…

Kubernetes(K8S第三部分之资源控制器)

资源控制器 什么是控制器 Kubernetes中内建了很多controller&#xff08;控制器&#xff09;&#xff0c;这些相当于一个状态机&#xff0c;用来控制Pod的具体状态和行为。 控制器类型 ReplicationController和ReplicaSet Deployment DaemonSet StateFulSet Job/CronJob…

javascript学习快速入门

JavaScript 基本语法 快速入门 数据类型 123 // 整数123 123.1 //浮点数123.1 1.123e3 //科学计数法-99//复数 NaN// not a numberInfinity //表示无限大注意点 NaNNaN&#xff0c;这个与所有的数值都不相等&#xff0c;包括自 己 只能通过isNaN(NaN)来判断这个数是否是Na…

Behavioral Verilog

行为Verilog Vivado synthesis支持行为Verilog硬件描述语言&#xff08;VHDL&#xff09;&#xff0c;除了如另外指出的。 行为Verilog中的变量 •行为Verilog中的变量声明为整数。 •这些声明仅用于测试代码。Verilog提供诸如reg和用于实际硬件描述的导线。 •reg和wire之…

华为od机试C卷-最长表达式求值

1 题目描述 提取字符串中的最长合法简单数学表达式子串&#xff0c;字符串长度最长的&#xff0c;并计算表达式的值&#xff0c;如果没有返回0。简单数学表达式只能包含以下内容0-9 数字&#xff0c;符号* 说明: 1.所有数字&#xff0c;计算结果都不超过 long 2.如果有多个长…

mysql学习笔记5——对表的修改操作

对表的列进行操作 对表可以进行创建create与删除drop&#xff0c;同时可以对表进行修改alter 修改字段 添加字段 删除具体的某一列 添加列时可以指定添加位置 对表的数据进行操作 select查询操作可以指定查询条件 删除具体数据&#xff08;而非删除表中某一列某一行&#xf…

简单聊聊http协议头参数之Content-Type和http状态码 415错误

大家好&#xff0c;我是G探险者。 今天聊一下http的状态码&#xff0c;415错误&#xff0c;因为项目里面使用了httpclient进行了远程服务调用&#xff0c;调用发送时&#xff0c;会有一个http header的参数设置。由于参数设置的问题经常会出现错误&#xff0c;导致调用失败&am…

Linux的进程的概念

目录 1.冯诺依曼体系结构&#xff08;硬件&#xff09; 2.操作系统(软件) 2.1概念 2.2设计os(操作系统)的目的 2.3如何理解管理 2.4系统调用和库函数概念 3.进程 3.1基本概念 3.2描述进程-PCB和组织进程 3.3ps axj指令 3.4查看进程 3.5通过系统调用获取进程表示符(P…

一篇了解电阻的使用

目录 一、电阻理论基础 1.电阻的定义 2.欧姆定律 3.电阻决定式 4.电阻的串并联​编辑 5.电阻的功率 6.温度对电阻的影响 二、电阻的选型 1.安装方式 2.电阻值 &#xff08;1&#xff09;电阻值的标称 &#xff08;2&#xff09;电阻值的确定 &#xff08;3&#x…

管家婆订货易在线商城 VshopProcess 任意文件上传漏洞复现

0x01 产品简介 管家婆订货易,帮助传统企业构建专属的订货平台,PC+微信+APP+小程序+h5商城5网合一,无缝对接线下的管家婆ERP系统,让用户订货更高效。支持业务员代客下单,支持多级推客分销,以客带客,拓展渠道。让企业的生意更轻松。 0x02 漏洞概述 管家婆订货易在线商城…

Fastwhisper + Pyannote 实现 ASR + 说话者识别

文章目录 前言一、faster-whisper简单介绍二、pyannote.audio介绍三、faster-whisper pyannote.audio 实现语者识别四、多说几句 前言 最近在研究ASR相关的业务&#xff0c;也是调研了不少模型&#xff0c;踩了不少坑&#xff0c;ASR这块&#xff0c;目前中文普通话效果最好的…

Java多态性的作用及解析

多态性是 Java 面向对象编程的一个重要特性,它的主要作用包括以下几个方面: 提高代码的可扩展性:多态性使得我们可以在不修改现有代码的情况下,通过继承和重写方法来添加新的行为。这意味着我们可以在不影响现有功能的前提下,对代码进行扩展和修改。 增强代码的可读性:使…

基础真空技术外国文献Fundamentals of Vacuum Technology

基础真空技术外国文献Fundamentals of Vacuum Technology

Maven构建MapReduce程序上传至虚拟机运行找不到jdbc.Driver

问题前置&#xff1a; Maven构建MapReduce程序&#xff0c; pom中已经写入jdbc驱动&#xff0c; 上传至虚拟机运行扔找不到jdbc.Driver, 具体报错&#xff1a;java.lang.RuntimeException: java.lang.ClassNotFoundException: com.mysql.jdbc.Driver 第一步&#xff1a;确认pom…

2024022701-信息安全(二)——密码学

密码学的基本概念 密码学(Cryptology)&#xff1a; 研究信息系统安全保密的科学。 密码编码学(Cryptography)&#xff1a; 研究对信息进行编码,实现对信息的隐蔽。 密码分析学(Cryptanalytics) &#xff1a; 研究加密消息的破译或消息的伪造。 消息被称为明文(Plaintext)。 用…

LeetCode第125场双周赛个人题解

目录 100231. 超过阈值的最少操作数 I 原题链接 思路分析 AC代码 100232. 超过阈值的最少操作数 II 原题链接 思路分析 AC代码 100226. 在带权树网络中统计可连接服务器对数目 原题链接 思路分析 AC代码 100210. 最大节点价值之和 原题链接 思路分析 AC代码 10023…

【动态规划】第十一届蓝桥杯省赛第二场C++ C组《数字三角形》(c++)

1.题目描述 上图给出了一个数字三角形。 从三角形的顶部到底部有很多条不同的路径。 对于每条路径&#xff0c;把路径上面的数加起来可以得到一个和&#xff0c;你的任务就是找到最大的和。 路径上的每一步只能从一个数走到下一层和它最近的左边的那个数或者右边的那个数。 …