清远市网站建设_网站建设公司_测试上线_seo优化
2025/12/18 18:04:43 网站建设 项目流程

1、问题

使用OutlinedTextField的组件的时候发现问题:
①、OutlinedTextField 设置了最小高度,且contentPadding无法修改,最小高度过高,不符合UI设计,所以通过自定义的方式进行两个参数的问题。
②、使用OutlinedTextField时,发现设置Modifier参数不能使用heightIn设置高度的范围,当trailingIcon结尾图标不为null的时候,value值无法居中,所以通过计算高度的方式进行强制设置高度。

2、解决问题2的实现方式

① 获取每一行中text可见最大的宽度
② 计算输入框中具体值的宽度
③ 获取输入框中一行的高度
④通过计算具体值有多少行来设置OutlinedTextField的高度

3、代码实现:

3.1 计算具体值的文本宽度

/** * 计算文本宽度 */@ComposablefunMeasureTextWidth(text:String,textStyle:TextStyle=LocalTextStyle.current,onWidthMeasured:(Float)->Unit){valtextMeasurer=rememberTextMeasurer()valdensity=LocalDensity.current// 获取当前密度LaunchedEffect(text,textStyle){valtextLayoutResult=textMeasurer.measure(text=AnnotatedString(text),style=textStyle,constraints=Constraints(maxWidth=Int.MAX_VALUE))valwidthInPx=textLayoutResult.size.width.toFloat()valwidthInDp=with(density){widthInPx.toDp()}// 转换为dponWidthMeasured(widthInDp.value)// 返回dp值}}

3.2 获取自定义的宽度和高度,并计算需要的高度

outLineHeight 为OutlinedTextField的高度设置

valvalueWidth=dimensionResource(R.dimen.width_200).valuevalvalueHeight=dimensionResource(R.dimen.outlin_text_height).valuevarvalueIntbyremember{mutableStateOf(1)}if(bean.value.isNotBlank())MeasureTextWidth(text=bean.value,textStyle=textStyle,onWidthMeasured={valueInt=ceil(it/valueWidth).toInt()})valoutLineHeight=(valueHeight*valueInt).dp

需要专业的网站建设服务?

联系我们获取免费的网站建设咨询和方案报价,让我们帮助您实现业务目标

立即咨询