我有一个文本字段,它位于Container的中心.我的问题是,我越降低屏幕高度,文本字段中的文本越超出边界.我用容器包装了文本字段,并给它赋予了 colored颜色 ,看起来文本字段正确地适应了容器的变化,但文本或文本字段的输入会自行行为,并随着我越多地调整高度而超出边界.有什么解决办法吗?

Column(
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  children: [
                                    Container(
                                      height: height * 0.076823398741207,
                                      width: width * 0.414674703803783,
                                      decoration: BoxDecoration(
                                        color: Color.fromARGB(212, 17, 19, 57),
                                        borderRadius: BorderRadius.circular(20),
                                      ),
                                      child: Center(
                                        child: Row(
                                          children: [
                                            Expanded(
                                              child: TextField(
                                                style: TextStyle(
                                                  color: Colors.white,
                                                  fontSize: width *
                                                      0.0103928497193931,
                                                ),
                                                decoration: InputDecoration(
                                                  filled: true,
                                                  fillColor: Colors.red,
                                                  constraints: BoxConstraints(
                                                      minHeight: 120),
                                                  contentPadding:
                                                      EdgeInsets.only(
                                                    left: width *
                                                        0.0166285595510289,
                                                  ),
                                                  border: InputBorder.none,
                                                ),
                                              ),
                                            ),
                                          ],
                                        ),
                                      ),
                                    ),
)

Sampel of the problem

我try 了很多解决方案,比如用SingleChildScrollView包装它,设置max line和minline,但什么都没有.唯一似乎稍微改变了文本行为的是,在文本字段的InputDecorator的约束中设置了MaxHeight和MinHeight.

推荐答案

与其给出fontSize: width * 0.01...,不如试着在你的build中这样做(否则上下文将无法访问)

final cellHeight = MediaQuery.of(context).size.height / 100;
final cellWidht = MediaQuery.of(context).size.width / 100;

通过这样做,您创建了2个变量,它们表示屏幕宽度或高度的1/cellHeight(响应). 然后你可以用你喜欢的fontSize乘以你的cellHeightcellWidth,fontSize就会有react .

Column(
 mainAxisAlignment: MainAxisAlignment.center,
   children: [
      Container(
         height: cellHeight * 8, <-- EXAMPLE
         width: cellWidth * 20, <-- EXAMPLE
         decoration: BoxDecoration(
            color: Color.fromARGB(212, 17, 19, 57),
            borderRadius: BorderRadius.circular(20),
         ),
         ....
         child: TextField(
            style: TextStyle(
            color: Colors.white,
            fontSize: cellWidth * 7, <-- EXAMPLE
         ),
         decoration: InputDecoration(
         filled: true,
         ....
        contentPadding:EdgeInsets.only(
           left: 5 * cellWidth,  <-- EXAMPLE
        ),
        border: InputBorder.none,
       ),
      ),
     ),
    ],
   ),
  ),
 ),
)

让我知道这是否解决了您的问题,如果没有,请用更多关于错误的详细信息更新您的问题,祝您编码愉快!

Flutter相关问答推荐

在Flutter中,CachedNetworks Image不工作(不从CachedData加载)

当第二页在单独的小工具中使用Navigator.pop时,Navigator.push不起作用

在Flutter中创建具有固定行的压缩水平列表

如何在不使用NULL-check(!)的情况下缩小`FutureBuilder.Builder()`内部的`Snaphot`范围

我怎样才能判断一个字符串值是否为空(&Q;&Q;)?

相同的Flutter 代码库,但Firebase登录适用于Web应用程序,但无法登录iOS应用程序

如何在应用程序中使用Fflight显示表情包

如何让经过Firebase身份验证的用户能够将Zip文件上载到Firebase云存储?

如何在点击查看措辞下方添加句子?

打开键盘时屏幕组件会被压扁

如何使自动焦点位于已经有一些文本的 TextField 的第一行?

如何计算 Firestore 集合中的文档数量?

Flutter - 定义按钮的优雅方式

Flutter HLS .m3u8 视频无法实时播放

statefulWidget 无法进行所需更改的问题

单元测试中如何比较NaN和NaN是否相等

在 Android 12+ 中,REST API 调用在 flutter 中非常慢,在 WiFi 中需要 10 秒,而在移动数据中不到一秒

我想在数组中添加项目

如何在 IntroductionScreen 小部件 Flutter 中制作全屏渐变色

用于空值 FirebaseFirestore 的空值判断运算符